Учитывает ли браузер media условия при загрузке изображений?
549
4
Всем привет! Подскажите, при таком условии:
1) Браузер все равно подгружает картинку, а потом выполняет условие (убирает ее) или же -->
2) Браузер видит условие меньше или = 992 и не подгружает фон при просмотре на таком разрешении???
P.S Стало дико интересно, а внятного ответа так и не нашел.
@media (min-width: 992px) {
body {
background-image: url(/img/1999.png);
}
}
body {
overflow-y: scroll;
background-color: grey;
background-attachment: fixed;
}
<img
src=«https://itchief.ru/assets/uploadify/7/e/5/7e5703031bbcef5a782a0c66fb3554ccs.jpg» class=«fancybox thumbnail center»>
1. Изменяем размер браузера так, чтобы он был меньше 992px. После этого переходим на вкладку Network и загружаем страницу.
На скриншоте видим, что браузер не загружает изображение «/img/1999.png», если ширина viewport меньше 992px.
2. Изменяем ширину браузера (>= 992px) и опять загружаем страницу.