display:none对图片加载的影响

对img标签的影响

<div style="display: none;">
    <img src="logo.png" />
</div>

在父级css设置了display: none的情况下，logo.png会向浏览器发送请求吗？

答案是会向浏览器发送请求，css只是会隐藏dom的显示，但是不会影响浏览器对dom的加载解析。

对background-image的影响

<div style="display: none;">
    <div style="background-image: url(logo.png);"></div>
</div>

在父级css设置了display: none的情况下，logo.png会向浏览器发送请求吗？

答案是不会的，css在父级为display: none的情况下，会认为下面的css解析渲染是没有意义的，所有不会向浏览器发送图片加载的请求。

css设置了display: none，浏览器将不会对下面的css进行解析渲染，将会忽略。