基于 EM 的媒体查询不适用于 Android 浏览器 v4.3
Posted
技术标签:
【中文标题】基于 EM 的媒体查询不适用于 Android 浏览器 v4.3【英文标题】：EM based media queries not applying on Android browser v4.3 【发布时间】：2014-11-07 13:43:02 【问题描述】：我的项目在从移动设备（在我的情况下为 android 浏览器 4.3）打开时不应用媒体查询。
为了简化问题并在此处显示，我创建了一个 super simple ONLINE DEMO 仅使用以下代码：
<!doctype html>
<html lang="es">
<head>
<title>EM TESTER</title>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1, user-scalable=yes">
<style>
bodybackground-color: yellow;
@media screen and (max-width: 25em)
bodybackground-color:red;
</style>
</head>
<body>
<div style="font-size:300%;">25 EM TESTER</div>
</body>
</html>
当我从我的手机打开它时，它应该有红色背景，因为它小于 25 em 宽度，但它不应用这个。
这可以在我的 Android 上的 Chrome 上正常运行，但不能在我的 Android 浏览器 4.3 上运行。我已经在近 10 台设备上进行了测试，并且所有设备都可以正常工作（背景颜色为红色），即使在其他设备上也是如此Android 浏览器版本。
这方面有什么已知的错误吗？
如果我使用 PX 而不是 EM 设置媒体查询，它会正确应用。
【问题讨论】：
【参考方案1】：不同的浏览器/设备有不同的问题，移动浏览器的问题尤其严重。它只是你的手机还是所有的安卓设备？这可能只是一个专门与该浏览器或设备相关的问题。在其他移动浏览器上进行测试，看看哪些浏览器存在问题。缩小范围，然后您可以开始研究更具体的问题。此外，请仔细检查您的移动浏览器屏幕宽度，这有时会让人感到困惑。
【讨论】：
检查其他设备后，我的浏览器似乎是一个f ***king buf：所有移动设备都显示红色背景。我的，黄。我会更新浏览器版本信息 有时您只需要处理一些显示不同内容的浏览器。由于它仅在 android 上与您的特定设备结合使用，这意味着它只占市场的一小部分。我会解决它。为网络设计意味着例外。 我同意，这就是昨天决定的。令人讨厌的是，Android 浏览器不关心更新新功能，只是在网上查一些信息，这个浏览器似乎是当前最糟糕的浏览器（即使是寡妇手机浏览器也更好......）。他们为什么不在所有 Android 设备上预安装 Chrome 而不是这个糟糕的东西？好吧，谢谢你shadw 我用 chrome，一切都很好 我也是，但很多 Android 用户甚至不知道有移动 Chrome 版本。他们看到 Internet 图标，这是他们独特的导航应用程序，所以我担心无法为他们提供此功能。但是经过测试，在较新和较旧的 Android 浏览器版本上都可以正常工作，所以这一定是我的手机/型号/任何东西的特定问题以上是关于基于 EM 的媒体查询不适用于 Android 浏览器 v4.3的主要内容，如果未能解决你的问题，请参考以下文章