css max-device-width 800与android手机不匹配

Question

我正在做一个网站，应该看起来不同的移动设备，而不是它的外观在桌面上。如果相关的话，我正在nexus-s - android 2.3上测试它。我已经将viewport元标记设置为device-width。

在CSS中，我添加了一个包含所有移动特定样式的@media all and (max-device-width: 800px)规则。但所有这些都没有得到应用。我已经把它都做成了!important，并把它作为css文件的最后一块放进去了，但是它仍然不能工作。

有没有人经历过这样的事情？

Answer 1

我有一个mobile screen width测试页面，用于检查移动设备上的各种屏幕分辨率。在我的HTC Desire上，宽度规则匹配800px，如果我在viewport meta中指定initial-scale为0.67。

如果我将width设置为device-width，而initial-scale设置为1.0，则屏幕在CSS规则中显示为533像素。

在你的手机上查看它，看看它对你的页面是否有帮助。

Answer 2

你是不是在标题里放了这个：

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