人们经常说,当使用 background-image 平铺网页背景时,由于需要平铺的频率较低,因此使用尺寸较大的图像性能会更好。一段时间以来,我一直将它们设为 8x8 像素,或 8 的倍数。
但是有没有人有指向数据的链接,这些数据可以证明在一系列浏览器中都是这种情况,包括渲染时间或页面渲染不同点的 CPU 负载?
最佳答案
我想这在您评论中列出的这些现代浏览器中无关紧要:
IE 8/9, and latest versions of Firefox/Safari/Chome/Opera
但是,我听说 IE8 中的一个错误,当涉及到大小正好为 1px * 1px
的图像时:
Internet Explorer 8 doesn't perform the repeat of a 1x1 pixel semi-transparent background image correctly when any other element on the page is using the "-ms-filter" drective for the alpha transparency:
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";
参见:http://nemesisdesign.net/blog/coding/ie8-1x1px-semi-transparent-background-bug/
和演示:http://static.nemesisdesign.net/demos/ie9-1x1px-semi-transparent-background/
所以,8x8
似乎是一个足够好的尺寸来使用。如果 Internet 上有人对此足够关心并对其进行严格的基准测试,我会感到惊讶。
我确实找到了这个,它讨论了这个主题:
http://blogs.adobe.com/dreamweaver/2011/02/optimal-css-tiled-background-image-size.html
请务必阅读评论。
总结一下,我将引用几个月前的自己的话:
I'd imagine it matters very little in [the] modern browsers [IE 8/9, and latest versions of Firefox/Safari/Chome/Opera] you listed in your comment.
关于css - CSS平铺背景图像的最佳尺寸,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/4932664/