Question

我们在Magento网站上有一个背景，由于内容的数量，它会根据需要进行扩展。它似乎在PC和（希望是Mac）上运行良好。但在任何iOS设备上，都不会显示白色背景。

我已经包含了两个屏幕截图 - 一个在常规PC浏览器中的外观和一个显示它在iPhone上的外观。

以下是直接指向未在iOS设备上显示的图片的链接： http://tinyurl.com/bcovmvg

谢谢！

Answer 1

你有一个名为.box_top的类。在里面你有一个浮子：左;我不知道为什么，但尝试删除它，并用溢出代替它：隐藏。至少在FireFox和IE9中他们是。

.box_top {
    background: url("../images/box_top.png") no-repeat scroll center top transparent;
    display: block;
    overflow: hidden;
    width: 1002px;
}

此外，删除保证金：0 0 -5px。这会在边框外侧的每个框底部产生一个小灰色阴影。

Answer 2

这是iOS 6.0中的一个新错误，其中未以“隔行扫描”关闭，未显示或有时完全黑色的PNG图像保存。尝试保存PNG文件，并将“隔行扫描”设置为“关闭”

Answer 3

为什么该图像不会在iOS中显示，图像尺寸为978x10000像素（是10,000），这一点毫无疑问。虽然它在磁盘上只有167 kB，但当扩展到内存时，它是巨大的。

来自Safari Web Content Guide：

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

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

除了不在iOS Safari上显示外，您还确定每个其他浏览器都会占用大量内存。当然，您可以分离图像的“顶部”和“侧面”部分，并使用background-repeat平铺边。没有理由认为那个东西的“侧面”部分的高度超过50px。

这不是隔行扫描问题，图像为encoded without interlacing

背景图片不会在iOS上显示，但在其他浏览器上显示正常

3 个答案: