背景图像不显示在iPhone / iPad上

由于内容的多less,我们的Magento网站上有一个背景图片,根据需要进行扩展。 它在个人电脑和(希望Mac)上运行良好。 但在任何iOS设备上,白色背景都不显示。

我已经包含了两个屏幕截图 – 一个普通的PC浏览器的外观和一个显示它在iPhone上的外观。 (请参阅下一篇文章的截图)

这里是我们的网站: http : //tinyurl.com/arfpf7g

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

谢谢!!

问题是iOS对可以加载的图片的最大尺寸有限制。 从内存来看,根据设备的不同,它有3-5百万像素。 作为参考,您的图像是9.78mp(978 x 10000)。

你的背景图像绝对没有理由是那么大。 这是171kb,约10px后可重复。 剪出顶部,它可以是10px高,你可以实现相同的影响,使用background-repeat: repeat-y代替。 然后只需将背景的顶部应用到另一个元素。

或者,该背景图像可以使用箱形阴影和虚线边框在CSS中复制。

CSS:

 .outer { margin: 20px; width: 200px; box-shadow: 0 0 10px 4px rgba(0, 0, 0, 0.3); padding: 10px; } .inner { height: 200px; border: 1px dashed #bde432; } 

HTML:

 <div class="outer"> <div class="inner"></div> </div> 

演示: http : //jsfiddle.net/WUpEF/