【问题标题】:Incorrect width in Android webkit browserAndroid webkit浏览器中的宽度不正确
【发布时间】:2011-09-21 14:20:50
【问题描述】:

我注意到 Android 的默认浏览器存在问题,其中 100% 的宽度实际上可能超出了屏幕边缘。这是一个最小的测试用例:

  <div class='separator' width=100% style='border: 2px;padding: 2px;border-style: solid;'>&nbsp;</div>
  <div class='separator' width=100% style='border: 2px;padding: 2px;border-style: solid;'>New & improved div</div>
  <div class='separator' width=100% style='border: 2px;padding: 2px;border-style: solid;'>another working one</div>
  <div class='separator' width=100% style='border: 2px;padding: 2px;border-style: solid;'>another</div>

这在桌面浏览器上按预期工作,但在 Android webkit 浏览器中,第一个 div 远离屏幕,并且在放大和缩小时不会改变宽度。之后的 div 可以正常工作。

更新:我已经在 2.3、3.0、3.1 和新创建的 2.2 模拟器上测试过,它们都无法正确调整大小。看起来其他人已经注意到了这一点,请参阅herehere。有人知道这个错误的好解决方法吗?

【问题讨论】:

  • 删除width=100%后会发生什么?
  • 在没有width=100%的Android浏览器上完全一样,可能不需要?它在我尝试过的所有桌面浏览器上都能正确显示,但在 Android 上却不行。
  • 将宽度更改为 99% 不会产生任何明显差异。
  • 这个例子似乎在 1.5 模拟器中工作得很好,很奇怪。这是 2.2 中引入的错误吗?
  • 你能在声明 WebView 的地方发布你的 xml 吗?

标签: android html webkit width


【解决方案1】:

只需在你的 html 头标签中添加这个元标签。我已经用 android 2.1 浏览器检查过它,它在缩放时工作正常。

<meta name="viewport" content="width=device-width" />

【讨论】:

  • 这似乎工作得很好,但它不能让你像往常一样缩小。在默认缩放下,您可以放大,但不能缩小。
  • 赞美你。这件事花了我一天一夜的时间才找到。
【解决方案2】:

在我的 WebView 中,我可以通过关闭宽视口来修复宽度。

webview.getSettings().setUseWideViewPort(false);

除非绝对必要,否则这将禁用水平滚动,并且 div 宽度和缩放按预期工作。显然,这仅适用于自定义 WebView,也许有一种更通用的方法可以使用 之类的方法?

【讨论】:

    【解决方案3】:

    使用

    layout_width="fillparent"
    

    :)

    【讨论】:

    • 如果 WebView 没有占据整个宽度,这可能会有所帮助,但这不是我的问题。这是 HTML 宽度的问题,甚至在默认浏览器应用中也会发生。
    猜你喜欢
    • 1970-01-01
    • 2011-10-03
    • 1970-01-01
    • 2019-07-02
    • 1970-01-01
    • 2023-04-10
    • 1970-01-01
    • 1970-01-01
    • 2011-01-11
    相关资源
    最近更新 更多