移动设备中的 CSS 响应式设计不适用于 uc 浏览器和 Opera mini [关闭]

Question

UC 和opera min 浏览器上的响应式网站无法正常工作（我们使用媒体查询进行响应式设计）。我搜索了一下，发现了一些链接：

css responsive design in mobile is not working

responsive website design is not working on mobile phone

但没有成功。任何帮助将不胜感激......谢谢

更新

我们正在 google nexus-5 上查看。

网站在 google chrome 上正常运行，但在 UC 和 Opera mini 浏览器上无法正常运行。

我们在 html 中使用下面的元标记

网站已上线，请在您的移动设备上查看（浏览器：UC 和 Opera mini）

https://www.urbanbinge.com/#!/

Answer 1

Opera mini 和 UC 浏览器部分支持 Javascript，但不支持用于响应式菜单的 3d 转换，例如 Foundation 和 Bootstrap 框架使用的（因为这些浏览器也未在其兼容性列表中提及）。而且它们不加载 gif，您必须使用 svg 图像来代替它，因为两者都在加载之前压缩它们的资源，这使得它与其他浏览器相比要快得多。

您可以分别查看以下链接查看 Opera Mini 和 UC 浏览器：

https://dev.opera.com/articles/opera-mini-content-authoring-guidelines/

http://forum.ucweb.com/forum.php?mod=viewthread&tid=871055

您可以通过检测这两个浏览器并使用带有 jQ​​uery Mobile 的 HTML 来修复它。

希望这会对你有所帮助。

Answer 2

如果 babel 与 react-transform-remove-inline-elements 的 react 预设一起使用，那么您的 javascript 将无法在移动 UC 浏览器中运行。我在使用 Kriasoft 的 react-starter-kit 时发现了这个问题。