iOS设备的Viewport meta标签

Question

说明

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

与

具有相同的效果

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

为ipad?

Answer 1

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

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

因此，我不同意James的建议。直接输入:

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

和处理大小差异使用液体/响应式布局技术