Сделать масштаб изображения в зависимости от разрешения

У меня есть width:100% изображения в заголовке моего сайта, как here:http://directdatanou.comli.com/Сделать масштаб изображения в зависимости от разрешения

Как я могу сделать масштаб изображения в зависимости от разрешения экрана?

Я пытался использовать изображение в качестве фона в DIV, как показано ниже:

<div id="header" class="latime_100p"> 

    </div>

с CSS:

#header{ 
    background: #5b6773 url("../grafica/header.jpg") no-repeat top center; 
    background-size: cover; 
    height:500px; 
}

Но это не масштабироваться прямо на больших разрешениях (это показывает только части изображения при увеличении ширины и высоты экрана).

Итак, у меня получилось использовать изображение напрямую?

Как я могу сделать его масштабируемым изящно в зависимости от разрешения?

спасибо.

источник

2015-08-10 Hello Lili

вы установили мин ширину на заголовок DIV, изображения и другие дивы, который заставляет страницу быть, что широкий (1280px в вашем случае), и он создает горизонтальную полосу прокрутки для вашей страницы в браузере вместо того, чтобы сделать страницу на 100% от размера экрана. , если вы хотите, чтобы он был отзывчивым (текущим по всем размерам экрана), удалите минимальную ширину во всех div и добавьте ширину: 100%, height: auto для стилей img ИЛИ, установите медиа-запрос с различными точками останова, которые загружают разные стили в зависимости от разрешения – Webpandit

Если вам нужно, что все изображение показывает:

<img src="...." class="img"> 

.img { 
    width: 100%; 
    height: auto; 
}

Это все

источник

2015-08-10 11:17:59

Это именно то, что я сделал, и как оно отображается сейчас –

И что вам нужно? Я вижу изображение так хорошо. –

Сделать масштаб изображения в зависимости от разрешения

ответ

Смежные вопросы