是否显示图像:none仍然发出HTTP请求?

rya*_*nve 13 html css performance image http

在样式表中:

#sj {display: none}
Run Code Online (Sandbox Code Playgroud)

在HTML中:

<img id="sj" src="scarlett-johansson.jpg" width="640" height="360" alt="scarlett johansson" />
Run Code Online (Sandbox Code Playgroud)

是否发生了对图像的HTTP请求?

And*_*ore 9

是的,它们仍会导致HTTP请求.示例:http://jsfiddle.net/RzFG2/


小智 6

有一种方法可以在使用时阻止HTTP请求display:none.您需要background-image在CSS中创建图像并将父元素设置为display:none.

HTML:

<div id="test3">
    <div></div>
</div>
Run Code Online (Sandbox Code Playgroud)

CSS:

#test3 div {
    background-image:url('images/test3.png');
    width:200px;
    height:75px;
}
@media all and (max-width: 600px) {
    #test3 {
        display:none;
    }
}
Run Code Online (Sandbox Code Playgroud)

这是一个链接,您可以在其中阅读有关此问题的各种测试.