Let's say I have CSS that looks like this:
#element {background-image: url("image1.png");}
#element {background-image: url("image2.png");}
Will the browser:
From some quick testing with Chrome and the Developer Tools:
#element
does not exist then neither image is downloaded, since the browser has no matching element to apply the style to#element
exists the usual CSS cascading and specificity rules apply and only image2.png
will be downloaded since that rule appears after the image1.png
rule.That said, other browsers may behave differently.