600 像素宽的页面在 640 像素宽的移动屏幕上显示不满

Question

我正在 iPhone 5s（分辨率为 1136 x 640 像素）上测试网页。

我已将元设置为：

<meta name="viewport" content="user-scalable=yes, initial-scale=1, width=device-width, shrink-to-fit=no">

和css：

body {
min-width: 600px;
}

页面上的其余类没有基于像素的宽度。它们都使用基于 % 的宽度，没有一个超过 100%。

但是，该页面并未完整显示在手机屏幕上。我必须水平滚动才能看到完整的视图。 只有当我将 body 的最小宽度设置为 300px 时，页面才会在手机屏幕上显示为满屏。

现在我想知道为什么当手机支持 640px 水平分辨率时，600px 不能完整显示。我可能遗漏了一些非常基本的东西，请指导。

Answer 1

你错过了应该计算 iPhone 屏幕的点大小，而不是像素。

This website which lists the viewport for most devices 确认。