我目前正在为客户开发一个网站（仍在进行中）并尝试解决该网站上的一些移动问题。
我遇到的主要问题是移动浏览器（android + iphone）在网站的左上角完全放大了加载网站。无论视口的宽度如何，我都希望将其缩小以适应视口中的整个站点宽度。
该网站可以在这里查看：http: //www.graceprep.com
有一个简单的解决方法吗？我在 HTML / CSS 方面经验丰富，但在移动浏览器方面我有点新手。
这是我的 header.php 文件中可能相关的一些 HTML。我尝试更改宽度属性无济于事。initial-scale 属性是有效的，但太宽泛了——我希望网站对于所有移动浏览器都完全缩小，无论方向或屏幕大小如何。
有没有办法做到这一点？
为什么你有那个元标签？如果您完全删除它，设备将自动决定缩放级别。
我几乎可以肯定
<meta name="viewport" content="width=device-width, initial-scale=1">
应该解决这个问题。您可以将“宽度”设置为您想要的任何值，但通过将其设置为设备宽度，它将调整为任何设备的像素宽度值。“initial-scale”控制指定宽度的缩放级别。
似乎大多数移动浏览器倾向于传达一个默认视口宽度，该宽度比移动设备的宽度要宽得多。例如，iOS Safari 假设网页的宽度为 980 像素，并缩小以适应可用的 iPhone 4 320 像素（https://webdesign.tutsplus.com/articles/quick-tip-dont-forget-the- viewport-meta-tag--webdesign-5972）。Android 浏览器倾向于适应 800 到 1024 CSS 像素之间的宽度（https://developers.google.com/speed/docs/insights/ConfigureViewport）。
预期的宽度似乎在元标记实现之前以某种方式传达，因此在某些情况下将宽度设置为设备的宽度似乎被视为放大。除非您页面上的 css 使用媒体查询来适应设备的实际宽度，我认为最好避免错过值的“宽度=设备宽度”部分，而只需设置您所追求的其他约束。