适用于Android的媒体查询

Question

我正在尝试设置MQ以使网站响应。我把它链接起来并且它工作得很好，但有一点需要注意max-width: 480px对droid不起作用。当我将最大宽度增加到大约900px时，它确实识别我的移动样式表。

我还没有找到答案，我玩了一些视口标签：

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

和

<meta name="viewport" content="width=device-width, target-densityDpi=device-dpi">

使用媒体查询定位Android手机的最佳方法是什么？

Answer 1

您可能遇到的一个问题是，Android手机，甚至苹果手机，都有不同的像素宽度。

例如，如果您在三星Galaxy S3或S4上进行测试，这些手机的像素宽度在横向模式下远远超过480px，即使考虑到像素密度，因此媒体查询永远不会触发。对于某些较新的设备，您最好定位用户代理，然后根据该标头响应提供移动查询。

另外，有关移动设备测试的详细信息，请参阅此answer。

Answer 2

您希望首先将元标记更改为

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

祝你好运！