当我将图像作为标记以及背景图像包含在DOM元素中时,浏览器有时会对同一图像发出两个请求。使用hover pseudo属性时有时也会发生这种情况。例如:
<html>
<head>
<style>
div{
background: transparent url(/img/stuff.png) no-repeat;
}
div:hover{
background: transparent url(/img/stuff.png) no-repeat 25px 0px;
}
</style>
</head>
<body>
<img alt="" src="/img/stuff.png"/>
<div>
</div>
</body>
</html>
为什么图像会被请求两次(或者可能三次)?这是我可以避免的行为吗?如果是,怎么办?
[编辑]
我在观看Google appengine本地服务器进程时注意到了这一点,因此我相当肯定它实际上并没有被浏览器缓存(如果我在firebug或webkit inspector中看到它的话)。
我在Google Chrome、IE7和Firefox 3中都见过。
最佳答案
这是IE6的一个已知问题,是您遇到的浏览器问题吗?
这里列出了几个原因和修复方法:
http://www.fivesevensix.com/studies/ie6flicker/