cordova – 在Phonegap中调整Android设备像素比率的问题

前端之家收集整理的这篇文章主要介绍了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(AKA Ripple)进行测试.

解决方法

您不能使用-webkit-max-device-pixel-ratio,因为它尚未受支持.

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

原文链接:/cordova/866730.html

猜你在找的Cordova相关文章