加载精灵1次或多次？

Question

我想知道，如果我这样做：

<div style="width:50px;height:50px;background: transparent url(sprite.png) 0px 0px no-repeat;">555</div> 
<div style="width:50px;height:50px;background: transparent url(sprite.png) -56px 0px no-repeat;">666</div> 
<div style="width:50px;height:50px;background: transparent url(sprite.png) -109px 0px no-repeat;">666</div> 

这种的下载图像的3倍？

还是要下载图像1次，并在网页中显示它的不同部分？

Answer 1

它将被下载一次，除非缓存关闭，获取Firebug并观察HTTP请求，然后您将更好地了解页面加载时会发生什么。

Answer 2

浏览器应该下载一次，除非你正在设置一些丑陋的那种无缓存头，事情

Answer 3

它只会下载一次，不用担心。

Answer 4

它仅下载图像1次，并显示在不同元件的一部分它:)

它在A list Apart的CSS子画面的文章中更详细地解释。