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

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

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

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

    1. Александр Мальцев
      26 февраля 2021, 15:36
      Спасибо, поправил.
    2. Антон
      26 февраля 2021, 01:27
      Александр, в очередной раз Спасибо за подсказку и помощь!
      1. Александр Мальцев
        25 февраля 2021, 16:17
        Привет! Для этого не обязательно искать ответ. Можно открыть инструменты разработчика в браузере (Ctrl + Shift + I) и проверить.

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

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