viewport meta 对元素宽度的影响到底是什么?

What exactly the effect of the viewport meta on elements width?

我看了一个w3school教程关于viewport meta标签,所以他们举了两个例子来解释标签的用法:

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

带标签的 first example one without it shows as expected, while the second example 调整智能手机上的图像宽度,使其成为视口宽度的 100%, 对我来说没有意义。为什么将虚拟宽度设置为等于设备宽度进行这种调整,在这两种情况下图像通常不适合整个宽度,因为它设置的 460px 宽度小于我超过 1000px 的设备宽度和更宽的虚拟宽度。

我的第二个问题是关于initial-scale=1,应该不是默认值吧,不声明会有什么不同

感谢您的关注。

查看该页面的 CSS。

img {
    max-width: 100%;
    height: auto;
}

最大宽度覆盖宽度。

除了昆汀的回答,

如果您将初始比例设置为“1.0”,则网页会以 1 比 1 的比例显示以匹配目标密度的分辨率。