Браузер запрашивает изображения при разборе CSS или после формирования правил?

Question

Когда браузер выполняет синтаксический анализ css, он загружает ресурсы, когда сталкивается с ними, или после того, как он прочитал файл css и создал набор допустимых правил?

Вот некоторые CSS, которые используют изображение для IE, но фон RGBA для браузеров, которые его поддерживают. Я предполагаю, что IE проигнорирует значение rgba и вместо этого загрузит изображение, в то время как другие браузеры никогда не будут запрашивать изображение. Это правда?

background:transparent url('../img/content/black-mask.png') repeat top left;
background:rgba(0,0,0,0.7);

Answer 1

Сначала браузеры всегда генерируют "вычисляемый стиль", поскольку они применяют таблицу стилей к структуре документа. Следовательно, background-image: свойство выбранных ящиков всегда будет пустым, потому что сокращение background: свойство очищает background-image свойство, потому что вы ничего не установили во второй строке - тем самым отменяя первую.

Однако даже с вычисленным стилем браузеры не обязательно загружают изображение. Попробуйте использовать разные изображения с :hover psuedo-class, и вы заметите задержку при загрузке браузером.

@Andre прав в том, что это в значительной степени деталь реализации, но большая часть поведения определяется спецификацией CSS (например, в стиле вычисляемых стилей).

Я полагаю, что больше браузеров, возможно, захотят улучшить работу с браузером, предварительно загрузив ресурсы, на которые ссылаются таблицы стилей, но вы не можете рассчитывать на это (мобильные браузеры могут никогда не сделать это, чтобы потреблять меньше данных, если они находятся в сотовой сети).