文章/答案/技术大牛

发布

社区首页 >问答首页 >Meta width=device-width在Galaxy Nexus上不能正常工作

问Meta width=device-width在Galaxy Nexus上不能正常工作
EN

Stack Overflow用户

提问于 2012-12-13 05:20:37

回答 1查看 2.8K关注 0票数 2

我期望窗口的宽度与物理屏幕的宽度相同。

在我的Galaxy Nexus上，屏幕的宽度是720像素，但窗口的宽度是360。

为什么？怎么了？页面的完整代码：

<!DOCTYPE html>
<html>
<head> 
  <meta charset="UTF-8" />
  <title>My Page</title> 
  <meta name="apple-mobile-web-app-capable" content="yes" />
  <meta name="viewport" content="width=device-width,initial-scale=1,user-scalable=no" />
  <script type="text/javascript" src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.8.3.min.js"></script>
  <script type="text/javascript">
    $(function() {
      windowWidth = $(window).width();
      windowHeight = $(window).height();

      alert("width: " + windowWidth + " height: " + windowHeight);
    });

</script>
</head>
<body id="bo">
</body>
</html>

android

web-applications

webview

回答 1

Stack Overflow用户

回答已采纳

发布于 2012-12-13 05:33:44

默认情况下，Android中的WebView会假设您的网页针对的是中密度设备，因此，它会相应地缩放内容。

从documentation (请参阅标题为构建网页以支持不同屏幕密度的一节)：

默认情况下，WebView会缩放网页，以便以与中等密度屏幕上的默认外观匹配的大小绘制网页。因此，它在高密度屏幕上应用1.5倍缩放(因为它的像素更小)，在低密度屏幕上应用0.75倍缩放(因为它的像素更大)。从API level ECLAIR开始，WebView支持DOM、CSS和meta tag特性，以帮助您(作为web开发人员)使用不同屏幕密度的目标屏幕。

因此，由于Galaxy Nexus是一个xhdpi设备，WebView将对您的内容应用2倍缩放，因此宽度为360。

如果你愿意，你可以改变它，它需要在你的超文本标记语言中添加一个<meta>标签。例如，将以下内容添加到您的标记中应该会得到准确的宽度：

<meta name="viewport" content="target-densitydpi=device-dpi" />

但是，请注意，在这种情况下，您将需要考虑密度。

票数 2

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/13848846

复制

相似问题

问Meta width=device-width在Galaxy Nexus上不能正常工作
EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问Meta width=device-width在Galaxy Nexus上不能正常工作EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问Meta width=device-width在Galaxy Nexus上不能正常工作
EN