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

Question

通常会说,当使用背景图像平铺网页的背景时,由于需要平铺较少的图像,因此对于尺寸较大的图像,性能会更好.有一段时间我一直在制作它们8x8像素,或8的倍数.

但是有没有人有数据链接证明这是在各种浏览器中的情况,在渲染时间或在各种页面渲染点的CPU负载？

Answer 1

我认为在您评论中列出的这些现代浏览器中,这一点很重要:

IE 8/9,以及最新版本的Firefox/Safari/Chome/Opera

但是,我听说IE8中有一个完全相同大小的图像1px * 1px:

当页面上的任何其他元素对alpha透明度使用"-ms-filter"drective时,Internet Explorer 8无法正确执行1x1像素半透明背景图像的重复:

-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-背景/

所以,8x8似乎足够好用的尺寸.如果互联网上的任何人都非常关心这一点,那么我会感到惊讶.

我找到了这个,讨论了这个主题:http:
//blogs.adobe.com/dreamweaver/2011/02/optimal-css-tiled-background-image-size.html

一定要阅读评论.

总结一下,我将在几个月前引用自己:

我想你在评论中列出的现代浏览器[IE 8/9,以及最新版本的Firefox/Safari/Chome/Opera]中的内容很少.

Answer 2

我不认为存在“最佳尺寸”，但普遍认为较大的尺寸比较小的尺寸更好：请参阅此问题，也请参阅此问题。