对于定义的屏幕尺寸，媒体查询无法正常工作

Question

我目前正在开发一个网站，为了使其具有响应性，我检查了它（在 Google Chrome 中），然后更改屏幕分辨率并相应地编辑媒体查询。

我面临的问题是，例如。我为 1366x768 编写了一个媒体查询（根据检查和分辨率更改方法），它工作正常，但是当我实际在具有 1366x768 分辨率的设备上查看它时，它会有所不同。但是，如果我在那个新设备中检查并将屏幕分辨率设置为 1366x768，那么它会显示我的编辑。 为什么会这样？如何对实际设备进行编辑？

Answer 1

您是否在 html 中添加了响应式元标记？

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

Answer 2

将您的网站开发为响应式网站的关键是使用“rem”而不是 px，用于几乎所有内容，如字体大小、填充等。并为不同的媒体查询更改根字体大小，瞧，这很多更简单！

我学得很辛苦，但值得！