视口元标记在 iPhone 上无效

Question

5

我的网站采用固定布局，大小为1090像素。当我使用这个meta标签时：

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

页面将会以放大的方式加载。但是不是全部放大（大约有300像素的宽度看不到）。

此外，您无法将页面缩小到足以看到整个页面。

应该使用width=device-width解决这个问题吗？

因此，我尝试了一个0.29的初始比例，在iPhone上效果很好。但是在iPad上加载网站时，它显然会太小。

我该如何解决这个问题？

更新：所以我刚才发现，宽度似乎是由我的页面高度定义的。 iPhone上的Safari适合视口的高度，并且不关心适合宽度，也不会让您缩小以查看整个宽度。看起来如果页面更高，您可以看到更多的宽度。横向宽度非常好。

- Jean

1个回答

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- Akki619 · Accepted Answer

如果您的设计不具有响应性，最好针对特定设备分辨率进行设置，例如对于320宽度的设备，我会使用 <meta name="viewport" content="width=320">。

我还注意到，将内容设置为设备宽度可能会在iOS 4 Safari中出现问题。恐怕这不是iOS Safari的问题，而是非响应式设计引起的问题。

此外，如果设计不具有响应性，则使用此组合是最糟糕的。

user-scalable=no or maximum-scale=1 with initial-scale=1

修改初始比例并不能解决所有设备的问题。