With multiple background images defined in the CSS class; Do all browsers download them all?

Question

body {
   background: url(image.png);
   background: -moz-linear-gradient(top, rgba(169,3,41,1) 0%, rgba(143,2,34,1) 44%, rgba(109,0,25,1) 100%);
}

I know that the gradient will be shown, and .png will be overridden if I use Firefox. But will the browser load .png? What about other browsers, their prefixes and vendor behavior?

Answer 1

It depends on which browser you use. For the most part, modern browsers like chrome don't download files until they read all the CSS statements that I think are. Since you declared two background "images", this does not actually load PNG, because the statement is overwritten.

, - , , , .