为什么尽管视口具有 initial-scale=1.0，但自适应页面仍显示为放大状态
Why does adaptive page appear in zoom-in state despite the fact the viewport has initial-scale=1.0
目前我正在制作自适应网页并面临以下问题。如果您在移动设备浏览器中打开此 page，您会看到它立即出现并具有放大效果。你需要手动缩小它，尽管它有以下视口：
<meta name='viewport' content='width=device-width, initial-scale=1.0'/>
但是如果设置这个视口：
<meta name='viewport' content='width=device-width, maximum-scale=1.0'/>
和open it然后我们将得到我们需要的效果（没有缩放的页面）。
谁能向我解释为什么会这样（视口值的不合逻辑行为）？
提前致谢！
本质上，您的问题是 "width=device-width" 告诉浏览器您的设计将在该浏览器的 css 宽度下工作。在 phone 上，它可以低至 320 像素。但是，您的设计在接近这么小的任何地方都不会响应地缩小 - 它只会缩小到 732 像素。
因此，当您将初始比例设置为 1 时，您只会在屏幕上看到前 320 个像素。
我相信，如果您只是不定义视口，那么它将按您希望的方式工作 - 从显示所有内容的缩放开始是大多数设备上的默认行为。这就是 width=device-width, maximum-scale=1.0 起作用的原因（没有设置开始缩放，所以它将使用默认值）。但是，maximum-scale 将限制用户可以缩放的范围。
（This 似乎是一个很好的概述）
目前我正在制作自适应网页并面临以下问题。如果您在移动设备浏览器中打开此 page，您会看到它立即出现并具有放大效果。你需要手动缩小它，尽管它有以下视口：
<meta name='viewport' content='width=device-width, initial-scale=1.0'/>
但是如果设置这个视口：
<meta name='viewport' content='width=device-width, maximum-scale=1.0'/>
和open it然后我们将得到我们需要的效果（没有缩放的页面）。
谁能向我解释为什么会这样（视口值的不合逻辑行为）？
提前致谢！
本质上，您的问题是 "width=device-width" 告诉浏览器您的设计将在该浏览器的 css 宽度下工作。在 phone 上，它可以低至 320 像素。但是，您的设计在接近这么小的任何地方都不会响应地缩小 - 它只会缩小到 732 像素。
因此，当您将初始比例设置为 1 时，您只会在屏幕上看到前 320 个像素。
我相信，如果您只是不定义视口，那么它将按您希望的方式工作 - 从显示所有内容的缩放开始是大多数设备上的默认行为。这就是 width=device-width, maximum-scale=1.0 起作用的原因（没有设置开始缩放，所以它将使用默认值）。但是，maximum-scale 将限制用户可以缩放的范围。
（This 似乎是一个很好的概述）