Meta viewport iPhone 4s 升级设计

Posted 2023-03-15

【中文标题】Meta viewport iPhone 4s 升级设计

【英文标题】：Meta viewport iPhone 4s upscales the design

【发布时间】：2012-08-10 14:34:43

【问题描述】：

我设计了一个分辨率为 640x960 像素的应用程序，现在我正在将其转换为适用于 iPhone 4S 的网络应用程序。如您所知，iPhone 4s 的分辨率为 640x960px。

为什么当我在元视口中使用width=device-width（不应该缩小或放大设计）时，iphone 使用 320 像素而不是 640 像素的宽度？

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

但是，当我使用width=640 时，它会强制浏览器使用 640px 作为宽度，但这不会自动更改其他设备（例如 iPad）的宽度。这对我来说毫无意义。

【参考方案1】：

content="width=device-width"

不会放大任何东西。它只会改变视口的宽度。在这种情况下，iPad 似乎很愚蠢，因为它在横向模式下也认为设备宽度中的宽度为 768 像素。

在横向模式下，为 iPad 设置特定的像素值会将其放大 1.333。 使用它并将其与响应式布局技术结合起来

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

另外，你所做的是正确的。只需为布局添加特定代码。让我的生活更轻松。