Question

由于某些未知原因，iPad Safari无法显示非常长的背景图像。在my example中，背景图像为1,000 x 10,000像素。相同的示例适用于任何桌面浏览器，例如Safari，Firefox等

我知道CSS中的background-repeat，但不幸的是，它不适用于我的特定情况。

Answer 1

Mobile Safari对子样本之前显示的背景图像大小有限制，由于背景大小，您可能会受到此问题的影响：

对于RAM小于256 MB的设备，解码的GIF，PNG和TIFF图像的最大尺寸为3百万像素，对于RAM大于或等于256 MB的设备，最大尺寸为5百万像素。

即，对于RAM小于256 MB的设备，请确保宽度*高度≤3* 1024 * 1024。注意，解码的尺寸远大于图像的编码尺寸。

请参阅：Know iOS Resource Limits

Answer 2

您可以使用多个背景图像来实现此目的。将长jpeg切成符合限制的可管理块，然后使用css3 magic将它们合并到一个背景中。

例如，我将一个7400像素的高图像切成2048像素块并将它们放回原处：

background-image: url('../images/bg_ipad1.jpg'), url('../images/bg_ipad2.jpg'), url('../images/bg_ipad3.jpg'), url('../images/bg_ipad4.jpg');
background-position: center 0px, center 2048px, center 4096px, center 6144px;
background-size: auto auto;
background-repeat: no-repeat;

以全分辨率加载iPad。

（真的）长背景图像无法在iPad Safari上渲染

2 个答案: