min-width:320px 在 Android 版 Opera Mini 上无法正确触发
在 Android 上的各种浏览器中测试一些媒体查询,发现我的 Samsung Galaxy S 上的 Opera Mini 6.5 似乎没有在以下代码中应用样式。
@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 - < a href="http://goo.gl/mgKJA" rel="nofollow">goo.gl/mgKJA
h5bp Mobile 3 元标记 - goo.gl/uxPsa
h5bp Mobile 2 元标记,最大比例设置为 1.0 和 Opera CSS 视口标记 - goo.gl/McNhj
仅视口元标记 -goo.gl/QMnmp
我在 Opera Mini 6.5 上的纵向 Galaxy S Epic 4G 上注意到了这个问题。
Testing some media queries in various browsers on Android and noticed Opera Mini 6.5 on my Samsung Galaxy S does not seem to apply stlyes inside the following code.
@media screen and (min-width: 320px){
It seems if I lower the value to 282, Opera Mini will excute the styles inside the media query.
@media screen and (min-width: 282px){
I'm wondering if anyone else has run into issues with Opera Mini not handling media queries correctly on Android phones. All of the other browsers I've tested on Android seemed to work fine with min-width:320px as well as my tests of Opera Mini on iOS devices.
I've set up a few test pages to check out with variations on the viewport meta tag.
h5bp Mobile 2 meta tags - goo.gl/XfEVx
h5bp Mobile 2 meta tags with maximum-scale set to 1.0 - goo.gl/mgKJA
h5bp Mobile 3 meta tags - goo.gl/uxPsa
h5bp Mobile 2 meta tags with maximum-scale set to 1.0 and Opera CSS viewport tag - goo.gl/McNhj
Viewport meta tag only -goo.gl/QMnmp
I noticed this issue on my Samsung Galaxy S Epic 4G in portrait orientation on Opera Mini 6.5.
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(2)
根据 Opera 文档,Opera Mini 6.5 支持媒体查询并使用 Presto 2.8。 Presto 2.8 中的媒体查询的支持似乎已经完成。
您是否尝试使用
初始
比例或设备宽度
或者
我搜索了我们的Opera错误报告,但我没有看到任何与此相关的内容。您是否有网页链接,以便我们进一步测试。
According to Opera docs, Opera Mini 6.5 supports Media Queries and using Presto 2.8. The support of media queries in Presto 2.8 seems to be complete.
Did you try to play with the
initial
scale ordevice-width
or
I searched our Opera bug reports but I didn't see anything related to this. Do you have a link to a Web page so we can test further.
您是否在所有版本的 Opera 和 IE9 中都看到同样的问题?您使用 Modernizr 和 Respond.js 吗?我有一个非常相似的问题,Respond.js 是来源。
我通过 http://www.initializr.com/ 将 Modernizr 和 Respond.js 捆绑到单个文件中解决了这个问题。
也许这有帮助。
Do you see the same problem in all versions of Opera and IE9? Do you use Modernizr and Respond.js? I had a very similar problem, Respond.js was the source.
I solved it by bundling Modernizr and Respond.js into single file via http://www.initializr.com/.
Maybe this helps.