【问题标题】:Why does my website look different in Android emulator and on devices?为什么我的网站在 Android 模拟器和设备上看起来不同?
【发布时间】:2015-08-12 11:43:38
【问题描述】:

我已经建立了一个网站(暂时没有链接)。所述网站具有响应性,并且通常在大多数现代设备上运行良好。我使用的唯一真正现代的 CSS 特性是“transition”、“transform”和“box-sizing”,这很有帮助。它们通常以带前缀和不带前缀的形式使用。

现在,由于我这里没有大量的 Android 设备,我想我会尝试使用 Android SDK 提供的 Android Emulator 中的网站。那时,我有点震惊地发现它在 4.3 以下的所有内容中都相当糟糕。

问题似乎是我的菜单实现使用了“transform: translate();”并且 Android 股票浏览器显然不支持此属性。

我注意到 Google 似乎在 Android 4.0、4.1、4.2 和 4.3 的模拟器图像中使用了相同的 WebKit 版本 (534.30)。 (如果我可以信任用户代理字符串。)

在 Android 4.4 及更高版本的模拟器图像中,一切正常。 Android 4.4 也是第一个使用基于 Chrome(版本 33)的 WebView 实现的版本。

我自己的 Android 设备(来自 Sony)在 Android 4.3 上运行。根据用户代理字符串,WebView的WebKit版本也是534.30。我在使用 WebView(来自 F-Droid 的闪电浏览器)的浏览器中尝试了我的网站。它有效,包括动画。

一位同事还在他的装有 Android 4.0 的三星设备上打开了我的网页。它也在那里工作。 (还没有检查那里的用户代理。)

所以,我想,也许 Google 会通过 Play Services 更新 WebView。据我所知,情况似乎并非如此:我禁用了 Play Services 应用程序,删除了它的数据,重新启动了手机。该页面仍然有效。

发生了什么事?制造商是否在疯狂修补 WebKit?我可以完全信任 WebKit 版本号吗?

(已更新以澄清实际问题。)

【问题讨论】:

    标签: android css webview webkit emulation


    【解决方案1】:

    检查屏幕尺寸。模拟器总是有不同的屏幕尺寸。这可能是问题所在。

    【讨论】:

    • 这不是问题。该页面的宽度从 ~280px 到 1200px。 (它也可以在上面工作,但是你只会得到更多的背景颜色。)
    • 告诉我们更多关于它是如何被破坏的。你试过更新浏览器吗
    • 将此添加到我的问题中:“问题似乎是我的菜单实现使用了transform: translate();,并且 Android 股票浏览器显然不支持此属性。”更新浏览器是无关紧要的,因为我想处理与旧浏览器的兼容性。此外,您无法在任何版本的 Android 4 中更新 WebView。
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 2018-07-06
    • 2017-07-03
    • 2021-07-12
    • 2017-04-01
    • 2015-01-08
    • 2013-08-12
    • 1970-01-01
    相关资源
    最近更新 更多