宽度超过100k像素的背景图像

Question

我有一个用作div背景的精灵表.尺寸是:

宽度:105920 高度:240.

这是一个大小为620kb 的单色png文件,所以我认为大小不是问题.

当我尝试将其用作background-image: url("spritesheet.png");Firefox时会抛出错误,说"图像损坏或截断".Chrome未显示任何错误消息,但未显示图像.

如果我用gimp将图像的宽度调整为10,000,一切都很好.但显然我不能再用它了.

CSS中允许的最大图像大小是否有任何限制？难道我做错了什么 ？

Answer 1

根据这个问题的答案，您的图像太大，Safari/iOS 无法处理。其他浏览器可能也有类似的限制，正如您在 Firefox 中发现的那样。620kb 的文件大小是可以接受的，但图像的尺寸（超过 2500 万像素）有点难以处理。

也就是说，即使浏览器可以显示您的图像，我也强烈建议不要使用这些尺寸的图像。人们出于性能原因而使用精灵，但是如此大小的图像会导致巨大的性能损失......你会搬起石头砸自己的脚。