我想显示一个包含大约6000个小图像缩略图的页面(每个40x40).为了避免发出6000个HTTP请求,我正在探索CSS精灵,即将所有这些缩略图连接成一个长条带并使用CSS来裁剪所需的图像.不幸的是,我发现JPEG文件在任何一个维度上都不能超过65500像素.警惕Web堆栈中的进一步限制,我想知道:以下任何一种都无法应对尺寸为40x240000的图像吗？
编辑:这样做的目的只是一次显示整个图像集,要求用户最多必须滚动.我希望"微缩略图"流入现有的CSS布局,所以我不能只使用大的矩形图像.我不希望用户必须点击多个页面才能看到所有内容.像素总数不是很大 - 只有2560x1600显示器的两倍.所有微缩略图的总文件大小只有几兆字节.假设每个图像都在浏览器的内存中未经压缩处理,每个像素占用8个字节的存储空间(RGBA加上100%的开销软糖因子),我们正在谈论数百兆字节的RAM使用率; 在2010年的专业申请并非不合理.
由于某些未知原因,iPad Safari不会显示非常长的背景图像.在我的示例中,背景图像为1,000 x 10,000像素.相同的示例适用于任何桌面浏览器,例如Safari,Firefox等.
我知道background-repeatCSS中的内容,但不幸的是它不适用于我的具体情况.