css - CSS平铺背景图像的最佳尺寸

Question

人们经常说，当使用 background-image 平铺网页背景时，由于需要平铺的频率较低，因此使用尺寸较大的图像性能会更好。一段时间以来，我一直将它们设为 8x8 像素，或 8 的倍数。

但是有没有人有指向数据的链接，这些数据可以证明在一系列浏览器中都是这种情况，包括渲染时间或页面渲染不同点的 CPU 负载？

Answer 1

我想这在您评论中列出的这些现代浏览器中无关紧要:

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.