Cordova 在Phonegap内调整Android设备像素比率的问题

我一直在尝试让媒体查询在具有不同设备像素比率的设备上正常工作。 当我从菜单中选择Nexus S时，它看起来棒极了。
当我从菜单中选择Nexus 4时，位置处于关闭状态。
从Chrome开发工具中，我看到Nexus S的计算风格是

(-webkit-max-device-pixel-ratio: 1)

对于Nexus 4：

(-webkit-max-device-pixel-ratio: 1.5)

这是我的CSS：

@media only screen and (orientation:landscape) and (-webkit-max-device-pixel-ratio: 1.5 ){
    .txt{
        top: 170px;
        left: 150px;
        position:absolute;
        font-size:60px;
     }
}

@media only screen and (orientation:landscape) and (-webkit-max-device-pixel-ratio: 3 ) and(-webkit-min-device-pixel-ratio: 2 ){
    .txt{
        top: 270px;
        left: 200px;
        position:absolute;
        font-size:60px;
    }
}

这是我的元视口标记：

<meta name="viewport" content="width=device-width; initial-scale=1; maximum-scale=1; user-scalable=0;"/>

---

我使用emulate.phonegap.com（又名Ripple）进行测试。

您不能使用

-webkit max device pixel ratio

，因为它（还）不受支持

---

我添加了这个答案，因为它可以帮助其他有相同问题的用户更快地找到解决方案。

遇到了同样的问题，并且在一天多的时间里击中了我的头。最终得到的解决方案是默认浏览器使用的媒体查询与Cordova的WebKit完全不同

使用PhoneGap起始页中的，而不是主页，并检查为特定webkit生成的媒体查询。在应用程序中使用它。能够针对任何屏幕因素

---

如果你有任何问题，试着告诉我

那么你的问题是什么？为什么Nexus 4使用（-webkit max device pixel ratio:1.5），而实际DPR为2？嗯，我不确定是否支持-max前缀。我只看到min@artworkadシ 这对我有用！请用与评论相同的答案回答此问题，以便我可以接受。

atmedia.info

域已过期！