Android WebView似乎忽略了网页上的“视口”信息

我有一个网站使用视口META标签告诉移动浏览器如何显示内容()。 在Android浏览器中查看页面看起来是正确的(和iPhone等)。

当我将页面加载到Android应用程序中的WebView组件时,WebView忽略“VIEWPORT”标记,并以“完整”分辨率呈现页面,在这种情况下,该分辨率会放大。

根据WebView文档的“构建支持不同屏幕密度的网页”部分仔细检查您的实现: http : //developer.android.com/reference/android/webkit/WebView.html

经过大量的实验,我确定如果实际页面强制宽度大于视口设置,Android WebView将不遵循“视口”设置。

例如,我设置的视口为500px,但我的页面上有一个强制960px宽度的元素。 视口没有被遵守,因为WebView拒绝隐藏额外的内容。

当我输入它时,这似乎很明显,但我必须花费数天时间研究这个问题。

正如文档在最佳答案的链接中所说,您可以使用元标记指定设备应如何响应Web应用程序与屏幕相比的大小。 以下标记使Android手机尊重我的网络应用的视口大小:

  

尝试使用WebSetting类的这种方法

 setUseWideViewPort (boolean use) 

我用这个来告诉Android webview考虑我的“viewport”标签

在一些Android手机上实现的另一个失败是事实,例如HTC Desire HD将忽略视口TAG – 用户规模=没有完全。

链接接受的答案, 这将有助于理解Android上的视口。

在我的场景中,使用固定宽度,解决方案是:

 settings.setUseWideViewPort(true) settings.setLoadWithOverviewMode(true) 

我只能确认你的问题。 android问题跟踪器有一个未解决的问题。 如果您受此影响,请给它投票/明星。

唯一对我有用的是

  

但特别是在已经存在的标签中添加了maximum-scale=1.0, minimum-scale=1.0 。 对于我的具体情况,我不想让用户能够放大/缩小YMMV。

用这个:

   

现在Android WebView和浏览器遵循视口设置。

Phew,这需要进行大量的调整以使其正确。 天啊。