我想显示一个包含大约6000个小图像缩略图的页面(每个40x40).为了避免发出6000个HTTP请求,我正在探索CSS精灵,即将所有这些缩略图连接成一个长条带并使用CSS来裁剪所需的图像.不幸的是,我发现JPEG文件在任何一个维度上都不能超过65500像素.警惕Web堆栈中的进一步限制,我想知道:以下任何一种都无法应对尺寸为40x240000的图像吗?
编辑:这样做的目的只是一次显示整个图像集,要求用户最多必须滚动.我希望"微缩略图"流入现有的CSS布局,所以我不能只使用大的矩形图像.我不希望用户必须点击多个页面才能看到所有内容.像素总数不是很大 - 只有2560x1600显示器的两倍.所有微缩略图的总文件大小只有几兆字节.假设每个图像都在浏览器的内存中未经压缩处理,每个像素占用8个字节的存储空间(RGBA加上100%的开销软糖因子),我们正在谈论数百兆字节的RAM使用率; 在2010年的专业申请并非不合理.
Ste*_*e-o 19
好吧,Safari/iOS列出了这些限制:
解码的GIF,PNG和TIFF图像的最大尺寸为3百万像素.也就是说,确保宽度*高度≤3*1024*1024.请注意,解码后的尺寸远大于图像的编码尺寸.
使用子采样,JPEG的最大解码图像尺寸为3200万像素.由于子采样,JPEG图像可以达到3200万像素,这使得JPEG图像可以解码为像素数量的十六分之一.大于2百万像素的JPEG图像被二次采样 - 即,解码为缩小的尺寸.JPEG子采样允许用户查看来自最新数码相机的图像.
单个资源文件必须小于10 MB.此限制适用于HTML,CSS,JavaScript或非流媒体媒体.