奇怪的缩放和尺寸行为与设备工具栏和 chrome 和边缘的响应式布局

Posted 2023-02-23

【中文标题】奇怪的缩放和尺寸行为与设备工具栏和 chrome 和边缘的响应式布局

【英文标题】：Weird zooming and dimensions behavior with device toolbar and responsive layout in chrome and edge

【发布时间】：2022-01-18 05:49:45

【问题描述】：

由于未知原因，我的 chrome 开发者工具 设备工具栏 在测试响应模式时开始出现异常行为。 打开时，网站完全缩小，页面尺寸不是工具栏中显示的尺寸，布局不会响应调整：

当我关闭设备工具栏时，它可以正常工作，我可以调整窗口大小并且布局会相应调整。

Chrome 版本：版本 96.0.4664.110（官方构建）（64 位）

注意：我选择了 google 网站作为示例，但对于我在本地处理的某些页面，它是相同的。

注 2：Edge 相同

注意 3：设备工具栏似乎在 Mozilla 中完美运行。

【参考方案1】：

好哇，看来答案是添加

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

https://css-tricks.com/snippets/html/responsive-meta-tag/