Блог

В вопросе, который я видел здесь, кто-то спросил, как изменить фон при обновлении страницы без использования каких-либо серверных методов. Одним из ответов было сделать это css

 .backgr0 { background-image: url('images/somepic.jpg'); }
.backgr1 { background-image: url('images/somepic.jpg'); }
.backgr2 { background-image: url('images/somepic.jpg'); }
.backgr3 { background-image: url('images/somepic.jpg'); }
.backgr4 { background-image: url('images/somepic.jpg'); }
  

а затем добавьте случайный класс к элементу.

Но мне было интересно, когда браузер обнаруживает этот css, продолжает ли он загружать все эти изображения? Потому что в этом случае вы действительно увеличиваете количество HTTP-запросов.

Как всегда, лучший способ узнать наверняка — протестировать это.

Вы обнаружите, что браузер загружает файл только в том случае, если он соответствует CSS. (по крайней мере, так ведут себя Firefox, Chrome и IE)

Например. если у вас есть это, но нет id="foo" элемента, браузер не загрузит его.

 #foo{
  background-image:url('some.png');
}