为什么android浏览器视口比手机的实际屏幕尺寸小得多，即使使用width = device-width？

Question

我想问一下为什么我的HTC Desire HD的浏览器会报告视口的宽度为369像素，即使屏幕的实际像素大小是480x800 WVGA。

我在我的页面中使用了这种CSS样式：

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

你能解释一下这个奇怪的行为，以及如何强制Android浏览器实际将视口的宽度设置为480px而不是奇怪的369px？

感谢您的帮助。

Answer 1

可以在blog post中找到有关该问题的详细说明。

您看到的数字（369像素）实际上是设备的大小乘以默认的假设，屏幕密度为160 dpi。

要使用设备屏幕密度，您必须在视口元数据中指定要使用设备的dpi。

例如：

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

编辑：WebView类的文档现在还包含有关target-densityDpi参数和可能值的信息。