我正在尝试了解ios设备的视口元标记。我创建了一个测试页面，在那里我插入了一个862px宽的图像。所以我将视口元标记为：
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale: .5, maximum-scale: 5.0">
然而在ipad 3上，分辨率宽度为1536像素，并且视口设置为与ipad 3相同的可见区域，862px图像被炸毁，宽度略大于可见区域。所以我必须水平滚动才能看到图像的其余部分。
这让我觉得设备宽度返回768像素，这对于862像素图像的水平滚动占了一点点额外。它为什么这样做？我需要考虑某种像素密度吗？
更新
我尝试将宽度设置为数字宽度，与图像的精确宽度相同（在本例中为“862”）。因此网页是862X206，与图像相同，但它与将宽度设置为设备宽度完全相同。
更新2
我创建了一个非常简单的页面，由于某种原因，带有862像素视口的空白页面会导致我的ipad 3水平和垂直滚动，代码为：
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=862, initial-scale=1.0">
</head>
<body style="width:100%; padding:0; margin:0">
</body>
</html>
此滚动导致视口不适合可视区域或屏幕大小。我不明白任何见解将不胜感激。谢谢。 **注意**我忘了将填充和边距重置为0，它增加了8 px的边距。
更新3
好吧，原来，我认为设备宽度会返回ipad 3的1536像素的分辨率宽度。显然，它返回768像素的屏幕尺寸。
任何视口宽度大于768，都能让我在ipad上滚动3.为什么？如果您有一个1024像素的页面，并且您希望将其放入ipad 3的可见区域，如果将宽度设置为1024，初始比例设置为1，则不应该使1024px视口适合可见区域？
解
好的，所以，如果你想让每台设备弄清楚如何扩展你的页面，你所要做的就是省略初始规模。
因此，如果我只使用设备宽度或数值设置宽度，并省略初始比例，它会自动为您计算缩放。它只是有效。
我的困惑在于宽度意味着什么，宽度意味着在应用比例之前的宽度， 所以，如果我说：
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale: .5, maximum-scale: 5.0">
缩放前的视口宽度为768，如果网页正文为862px，并且应用了比例因子1.0后，内容乘以1.0,862 * 1.0，则宽度为viewport 现在在该比例因子（862px）处缩放的内容宽度。我希望我明白这一点。这就是我的困惑，是宽度的意思。
答案 0 :(得分：3)
iPad 3的宽度为768像素，每个px代表2个物理像素。据我所知，您可以在Javascript中考虑它但不在视口中（并且您可能不想这样做，因为那些768像素的物理尺寸与早期iPad相同）。