iPad 3（或新 iPad）上的 CSS 媒体查询答案

【问题标题】：CSS Media Queries on iPad 3 (or the new iPad)iPad 3（或新 iPad）上的 CSS 媒体查询
【发布时间】：2012-04-09 09:09:47
【问题描述】：

应用 CSS 媒体查询来检测 iPad 3 或新 iPad 会有什么不同吗？

iPad 1 和 iPad 2 在两个方向上都返回了 768px 的设备宽度。那么在 iPad 3 上也一样吗？

【问题讨论】：

【解决方案1】：

新 iPad 将same device-width 报告为第一台和第二台 iPad (768)。

【讨论】：

【解决方案2】：

我相信是的。

如果您担心新 Retina 显示屏的像素分辨率进一步提高会带来影响，请在页面的 head 元素中添加以下内容：

<meta name="viewport" content="width=device-width, maximum-scale=1.0" />

请参阅这篇文章，了解有关检测视口尺寸的非常有用的信息：

【讨论】：

【解决方案3】：

新 iPad（或 iPad 3）的媒体查询几乎保持不变。因此，如果您检查 min-device-width 为 768px，它仍然适用于新 iPad。但是，为了提供更具体的查询，您可以检查 1536 像素和 2048 像素之间的设备宽度。

【讨论】：