Chrome 开发者工具中哪一个是准确的？响应或尺寸：[数量]

Question

我正在尝试构建响应式设计，但是遇到这个问题：

• 在 chrome 开发者工具中，如果我将设备屏幕尺寸设置为 例如1440px，一切都很好。请看这张照片：

• 但是当我尝试以响应方式查看我的网络时，使用相同的 宽度和高度（例如 1440px）存在不同的问题 出现在那里。请看这张照片：

.

所以我的问题是哪个更准确？如果具有此屏幕尺寸（例如 1440px）的用户看到我的网页，会显示哪一个？

Answer 1

HTML 5 包含一个方便的响应式设计工具，称为

viewport

。 尝试在 HTML 文件顶部包含

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

。这将自动将页面宽度设置为屏幕宽度。有关响应式设计的更多信息，我推荐 W3 School 的教程。此外，我建议您发布包含您的问题的代码示例，并尽可能避免使用图片。