大背景图像VS小重复背景图像

时间:2013-10-19 17:39:14

标签: html css performance background-image

我正在使用纹理,具体地linen texture,我无法用CSS渐变来制作它。所以,我的问题是关于绩效:

哪个最好,大背景图像或重复的小背景图像?

2 个答案:

答案 0 :(得分:3)

  

"哪个最好,是一个大的背景图像还是一个重复的小背景图像?"

后者。重复对性能影响很小或没有影响,而文件大小肯定会影响

答案 1 :(得分:1)

无论我的评论如何,下载一张小图片并平铺它比拥有一张大图片要便宜得多。如果使用平铺图像,则可以获得以下优势:

  • 在服务器上降低使用的带宽
  • 从浏览器中缩短下载时间
  • 关于渲染时间我不确定,你必须在这里运行一些基准,但它可能可以忽略不计。

所以你通常会想要一个平铺图像。 然而,您需要确保您的图像具有足够扁平的纹理,以使其平铺不会被视为强烈的重复图案。你的形象看起来还不错。

作为替代方案,您可以同时拥有较短的加载时间和高质量:

The Layered Look: Better Responsive Images Using Multiple Backgrounds