html - 响应式 - 所有元素在移动设备上都太小了

Question

我正在一个网站上工作，但我对移动设备上的视图有一个奇怪的问题。当我在桌面浏览器上调整窗口大小时，元素和字体会随着视口的变化而变化。当我在移动设备上打开网站时，所有字体和元素（例如汉堡菜单）都很小。看起来这是一个扩展问题或类似问题。我在头部有元视口标签，所以这不是问题。

我在这里或任何其他论坛上找不到任何类似的问题。我希望有人能帮忙。我附上了一些截图，但如有必要，我可以提供 URL。先感谢您。

全屏窗口
调整大小的窗口
响应示例 1
响应示例 2

标签： htmlcssmobileresponsivemeta-tags

Answer 1

确保包含响应式元标记，以确保您的浏览器获得设备的正确宽度，而不是缩小页面

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

这意味着浏览器将（可能）以自己屏幕的宽度呈现页面的宽度。因此，如果该屏幕是 320 像素宽，则浏览器窗口将是 320 像素宽，而不是缩小并显示 960 像素（或该设备默认执行的任何操作，以代替响应式元标记）。

进一步阅读这里