1

在 Android 上的各种浏览器中测试一些媒体查询,并注意到我的三星 Galaxy S 上的 Opera Mini 6.5 似乎没有在以下代码中应用 stlyes。

@media screen and (min-width: 320px){

似乎如果我将值降低到 282,Opera Mini 将执行媒体查询中的样式。

@media screen and (min-width: 282px){

我想知道是否有其他人遇到过 Opera Mini 无法在 Android 手机上正确处理媒体查询的问题。我在 Android 上测试过的所有其他浏览器似乎都可以正常使用 min-width:320px 以及我在 iOS 设备上对 Opera Mini 的测试。

我设置了一些测试页面来检查视口元标记的变体。

h5bp Mobile 2 元标记 - goo.gl/XfEVx

h5bp Mobile 2 元标记,最大比例设置为 1.0 - goo.gl/mgKJA

h5bp Mobile 3 元标记 - goo.gl/uxPsa

h5bp Mobile 2 元标记,最大比例设置为 1.0,Opera CSS 视口标记 - goo.gl/McNhj

仅视口元标记 - goo.gl/QMnmp

我在我的三星 Galaxy S Epic 4G 上在 Opera Mini 6.5 上纵向发现了这个问题。

4

2 回答 2

2

根据Opera 文档,Opera Mini 6.5 支持媒体查询并使用Presto 2.8Presto 2.8 中对媒体查询的支持似乎已经完成。

您是否尝试过使用initial音阶或device-width

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

或者

initial-scale=1.0

我搜索了我们的 Opera 错误报告,但没有看到与此相关的任何内容。您是否有指向网页的链接,以便我们进一步测试。

于 2012-02-14T14:51:11.143 回答
1

您是否在所有版本的 Opera 和 IE9 中都看到相同的问题?你使用 Modernizr 和 Respond.js 吗?我有一个非常相似的问题,Respond.js 是源。

我通过http://www.initializr.com/将 Modernizr 和 Respond.js 捆绑到单个文件中解决了这个问题。

也许这有帮助。

于 2012-04-05T13:29:20.830 回答