css - 如何防止 iPad/iPhone 的 CSS 也影响旧浏览器

Question

根据 Apple's developer instructions ，我使用以下 CSS 仅影响 iPad 和 iPhone。然而，CSS 似乎也在影响旧的浏览器(例如 Firefox 3.5)。关于如何只针对 iPad/iPhone 或只针对 Firefox 3.5，但不是两者，有什么建议吗？

@media screen and (max-device-width: 1024px) {
{...}
}

Answer 1

媒体查询基于屏幕尺寸(除其他外)。要定位到 iphone，您需要将查询更改为类似以下内容:

@media screen and (max-device-width: 480px) {
{...}

}

这只会针对最大显示分辨率为 480 像素的设备

您可以在此处阅读更多信息:http://perishablepress.com/press/2010/10/20/target-iphone-and-ipad-with-css3-media-queries/

而且我肯定会查看新的 Responsive design book from A Book Apart - 真的很好