iphone - 移动样式表不适用于 iPhone

Question

我刚刚编写了一些规则，以便在智能手机上显示我网站的移动版本。

移动规则使用“@media”包含在默认样式表 (http://www.flapane.com/style.css) 的底部。

@media only screen and (min-device-width : 320px) and (max-device-width : 480px), only screen and (orientation : landscape) and (min-device-width : 480px) and (max-device-width : 800px), only screen and (-webkit-min-device-pixel-ratio : 2), only screen and (min-device-pixel-ratio : 2), only screen and (-moz-min-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2/1)
 { [CODE]
}

我在 480x800 Android 设备上成功测试了它。它适用于横向和纵向模式。 ( http://i.imgur.com/mhqhr.png )

但是我在几个 friend 的iPhone4上测试过，一直显示桌面版。

我试过只用

@media only screen and (-webkit-min-device-pixel-ratio : 2)

但没有任何改变。

有什么提示吗？谢谢

Answer 1

将 @media only 屏幕和 (-webkit-min-device-pixel-ratio : 2) 更改为:

@media
only screen and (-webkit-min-device-pixel-ratio : 1.5),
only screen and (min-device-pixel-ratio : 1.5)

如 this example ，它应该工作。该页面也是一个很好的书签，供将来引用。