Учитывает ли браузер media условия при загрузке изображений?

Всем привет! Подскажите, при таком условии: 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;
}

Комментарии: 4

Nik
Nik
Александр доброго дня! Что то у вас на главной вот такая картинка выходит
<img
src=«https://itchief.ru/assets/uploadify/7/e/5/7e5703031bbcef5a782a0c66fb3554ccs.jpg» class=«fancybox thumbnail center»>

Александр Мальцев
Александр Мальцев
Спасибо, поправил.
Антон
Антон
Александр, в очередной раз Спасибо за подсказку и помощь!
Александр Мальцев
Александр Мальцев
Привет! Для этого не обязательно искать ответ. Можно открыть инструменты разработчика в браузере (Ctrl + Shift + I) и проверить.

1. Изменяем размер браузера так, чтобы он был меньше 992px. После этого переходим на вкладку Network и загружаем страницу.
Содержимое Network в Chrome
На скриншоте видим, что браузер не загружает изображение «/img/1999.png», если ширина viewport меньше 992px.

2. Изменяем ширину браузера (>= 992px) и опять загружаем страницу.
Браузер загружает изображение, если ширина viewport больше или равно 992px