css-sprites – 浏览器/ CSS规范中的最大图像尺寸？

我想显示一个包含大约6000个小图像缩略图(每个40×40)的页面.为了避免发出6000个HTTP请求,我正在探索CSS精灵,即将所有这些缩略图连接成一个长条,并使用CSS裁剪所需的图像.不幸的是,我发现JPEG文件在任何一个维度上都不能大于65500像素.担心网络堆栈的进一步限制,我想知道：以下任何一个无法应对尺寸为40×240000的图像？

> Internet Explorer
>歌剧
> WebKit
>任何CSS规范
>任何HTML规范
> PNG规格

编辑：这样做的目的只是一次显示整个图像集合,要求用户最多需要滚动.我想要“微缩略图”流入现有的CSS布局,所以我不能只使用一个大的矩形图像.我不希望用户点击多个页面来查看所有内容.像素总数不是很好 – 只有2560×1600显示屏才能使用两倍.所有微缩略图的总文件大小只有几兆字节.假设每个图像在浏览器的内存中都被解压缩,每像素占用8个字节的存储空间(RGBA + 100％开销软盘因子),我们正在谈论在数百MB的RAM中使用;对于2010年的专门应用程序而言并不合理.唯一不合理的事情是如果所有的微缩略图单独发送将生成的HTTP请求量.

解决方法

那么Safari / iOS列出了这些限制：

>解码的GIF,PNG和TIFF图像的最大尺寸为3百万像素.
也就是说,确保width * height≤3 * 1024 * 1024.请注意,解码的大小远远大于图像的编码大小.
> JPEG的最大解码图像尺寸为32万像素,采用二次抽样.
由于子采样,JPEG图像可以达到32百万像素,这允许JPEG图像解码为具有十六进制像素数的大小.大于2百万像素的JPEG图像被二次采样,即被解码为尺寸减小. JPEG子采样允许用户从最新的数码相机中查看图像.
>个人资源文件必须小于10 MB.
此限制适用于HTML,CSS,JavaScript或非流媒体.

http://developer.apple.com/library/safari/#documentation/AppleApplications/Reference/SafariWebContent/CreatingContentforSafarioniPhone/CreatingContentforSafarioniPhone.html

css-sprites – 浏览器/ CSS规范中的最大图像尺寸？

解决方法

猜你在找的CSS相关文章