我们的页面设计在我尝试过的所有 PC 浏览器中都表现良好，但在 iPhone 或 iPod Touch 上查看时却很奇怪。
问题与非常高的居中背景图像有关：
#content_container
{
background-image:url('content-background.jpg');
background-position:top center;
background-repeat:no-repeat;
width:1020px;
height:auto;
}
The content-background.jpg图像非常高（3000 像素），并且被设计为随着其所在 DIV 由于内容而增长而“显示”。
您必须查看页面和完整的 CSS 才能理解，因此我从设计中删除了所有其他内容，并通过此示例重现了问题：
http://files.codeulike.com/static/cssexample/example.htm
（示例由 1 个 html 文件、1 个 css 文件和 3 个图像组成）
您会看到，在 IE8、Firefox、Chrome 中，您会看到一个漂亮的绿色框。但在 iOS 浏览器中，细长的背景图像会重新缩放，一切都会变得奇怪。
（我使用的是 iPod Touch 第二代，但我认为其他 iPhone/iPod touch 也会出现同样的问题）。
非常感谢任何帮助！
弄清楚了：iPhone 对 Jpeg 有百万像素限制，之后它会缩小 Jpeg。
defusion.org.uk 上有一篇关于此的非常好的博客文章：http://www.defusion.org.uk/archives/2010/02/19/shrinking-large-background-image-bug-in-iphone-safari/
Jpeg 缩小的极限似乎是 2 兆像素左右。它是记录在案的 iOS 资源限制，如下所述：
Apple - 创建兼容的 Web 内容 - 了解 iOS 资源限制
最大解码图像尺寸
JPEG 为 32 兆像素，使用
二次抽样。
JPEG 图像最大可达 32 兆像素
由于二次采样，允许 JPEG
图像解码为具有
像素数的十六分之一。
大于 2 兆像素的 JPEG 图像
被二次采样——也就是说，解码为
尺寸减小。 JPEG 子采样允许
用户查看来自
最新的数码相机。
..我认为这意味着2兆像素以下的Jpeg可以正常显示，2到32兆像素之间的Jpeg通过子采样（缩小）显示，而超过32兆像素的Jpeg可能根本无法显示。
将我的网站更改为使用低于 2 兆像素的背景图像解决了问题。
本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系:hwhale#tublm.com(使用前将#替换为@)
