1

我正在使用我正在付费的移动模拟器，我可以在许多不同的手机上查看我的移动网站，并且所有安卓手机的主题是由于某种原因，我的媒体查询不起作用。他们正在开发 iPhone，但不确定 adnroid 发生了什么。这是我用于 android 媒体查询的内容：

@media only screen and (max-device-width: 400px) {
- styles here -
}

@media only screen and (max-device-width: 600px)and (min-device-width:401px) {
- styles here -
}

我的样式表中有这些部分，当我使用 Dreamweaver 时，所有不同的分辨率在移动尺寸中看起来都不错。然后我在想..哦等等，android会自动缩放屏幕以使它们更大，所以我将它添加到我的索引顶部：

<meta name="HandheldFriendly" content="true" />
<meta name="viewport" content="width=device-width, height=device-height, user-scalable=no" />

我添加了这些，但由于某种原因，Android 仍然没有关注媒体查询。即使我尝试过的设备包括 480px X 800px 所以它应该在那里工作......

有人有想法么？我知道机器人网页设计信息有点稀缺……但我希望那里可能有一些大师……我昨晚熬夜工作了大约 8 小时，哈哈。

编辑：进一步检查，看起来任何小于 400px 的东西都在工作，但是，最大和最小设备宽度在 600 到 400 之间，这会导致问题......

4

2 回答 2

1

我删除了 max-device-width:600px ，现在它正在呈现正确的东西。不知道发生了什么，但这就是答案，我做了什么。

于 2012-09-09T22:33:52.347 回答
0

在最大值之前重新排序最小值：

@media only screen and (min-device-width: 401px) and (max-device-width:600px) {
- styles here -
}
于 2012-09-09T22:15:05.607 回答