CSS最大设备宽度800与Android手机不匹配

Question

我正在制作一个应该在手机上看起来与台式机上的外观不同的网站。我正在Nexus -S -Android 2.3上测试它，如果相关。我已经设置了 viewport 元标记 device-width.

在CSS中，我添加了一个 @media all and (max-device-width: 800px) 具有所有移动特定样式的规则。但是这些都没有应用。我已经做了全部 !important 并将其作为CSS文件中的最后一个块，但仍然不起作用。

任何人都有这样的事情？

Answer 1

我有一个 移动屏幕宽度 测试页面，以检查移动设备上的各种屏幕分辨率。在我的HTC上，宽度规则与800px匹配，如果我指定 initial-scale 在视口元中的0.67。

如果我设置 width 至 device-width 带着 initial-scale 的 1.0, ，屏幕在CSS规则中以533像素的形式出现。

在手机上检查一下，看看它是否有助于您的页面。

Answer 2

您是否将其放在标题中：

<meta name="viewport" content="width=device-width"/>