无法使视口元标记工作答案

【问题标题】：Can't make the viewport meta tag work无法使视口元标记工作
【发布时间】：2012-09-29 16:28:15
【问题描述】：

我目前正在开发一个网站，该网站旨在在 iPad 上显示最佳，但必须在大多数移动浏览器上都能很好地显示。

我基于 2048px 的宽度创建 css，这是 iPad 3 在横向模式下的像素宽度。

然后我使用如下所示的视口元标记：

<meta name="viewport" content="width=2048" />

阅读了有关此主题的Apple documentation 和Android one，我了解到移动浏览器首先在视口元标记定义的更大区域中呈现网页，然后将其缩小以匹配设备宽度。

这在 iPad 2 上运行良好，但在 iPhone、iPhone Retina 和 Galaxy Nexus 上宽度会溢出。我没有机会在 iPad 3 上测试该网站。

如何解释这种行为？

如果要在此问题上添加任何详细信息，请告诉我。
提前感谢您的帮助。

【问题讨论】：

【解决方案1】：

具体来说：

计算默认初始比例以适应视口大小的网页。因为默认视口宽度为 800 像素，如果设备屏幕分辨率小于 800 像素宽，则初始比例默认小于 1.0，以适应屏幕上 800 像素宽的页面。

如果您将初始比例设置为 2，页面将被放大。如果您将其设置为 0.5，您将被缩小。 min 和 max 也可以覆盖这些属性

【讨论】：