Question

我使用Apache Cordova编写了一个Android应用程序。视口缩放了2倍。所有元素都比它们应该更大。这是视口声明：

<meta name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width, height=device-height, target-densitydpi=device-dpi" />

当我在浏览器中打开应用程序时，视口是正常的。我也有从视口正常的同一设备拍摄的旧屏幕截图。我试着清除应用程序数据，没有运气。

知道什么可以缩放视口吗？

编辑：我用这个html创建了一个新的cordova项目作为www：

中的唯一内容

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <meta name="format-detection" content="telephone=no" />
    <!-- WARNING: for iOS 7, remove the width=device-width and height=device-height attributes. See https://issues.apache.org/jira/browse/CB-4323 -->
    <meta name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width, height=device-height, target-densitydpi=device-dpi" />
    <meta name="msapplication-tap-highlight" content="no" />
    <title>Hello World</title>
    <style>
        .view {
            position: absolute;
            top: 0;
            left: 0;
            right: 0;
            height: 4px;
            background-color:blue;
        }
    </style>
</head>
<body>
    <div class="view">
    </div>
</body>
</html>

渲染的应用程序仍然是2的比例因子，蓝色div的高度为8px而不是4px。

enter image description here

编辑2：

我在其他设备上测试过：

Xpedia X10的缩放系数为1.
Galaxy S3的缩放系数为2。
Nexus 5的缩放系数为3。

Answer 1

问题似乎是设备试图在所有设备上保持相同的方面，模拟96 dpi。

参考像素是设备上一个像素的视角像素密度为96dpi，距离手臂的读取器的距离长度。对于标称臂长为28英寸，视角为因此约0.0213度。对于手臂的长度读数，因此1px 相当于约0.26毫米（1/96英寸）。

来自http://www.w3.org/TR/CSS2/syndata.html#length-units

默认比率取决于显示密度。在显示器上密度小于200dpi，比例为1.0。在密度显示在200和300dpi之间，比率为1.5。用于密度显示超过300dpi，比率是整数层（密度/ 150dpi）。注意仅当视口比例等于1时，默认比率才为真。否则，CSS像素和设备像素之间的关系取决于当前的缩放级别。

来自https://developer.mozilla.org/en/docs/Mozilla/Mobile/Viewport_meta_tag#A_pixel_is_not_a_pixel

我的视口被放大了？

1 个答案: