ipad - iOS 设备的视口(viewport)元标记

Question

是否说明

<meta name="viewport" content="width=device-width" />

与声明效果相同

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

对于 iPad？

Answer 1

这确实取决于设备的方向:设置特定的像素值将使您的布局按比例放大 1.333，以在横向模式下适应 1024 像素的设备宽度。

另一方面，设置 width=device-width 不会放大任何东西，但会更改视口(viewport)宽度，然后您可以使用媒体查询为此优化布局。或者这至少是理论:即使在横向模式下，iPad 也会以某种方式将 width=device-width 解释为 768px。为了获得真实的设备宽度，您必须添加 initial-scale=1。

因此，我不同意 James 的建议。只是去:

<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">

并使用液体/响应式布局技术处理尺寸差异。