android - HTC One Mini native 浏览器的媒体查询问题

Question

一般情况下，CSS 中设置的媒体查询会被浏览器识别 我不知道为什么，因为我放置了正确的元标记。它适用于所有其他浏览器(Chrome、Opera、Firefox...)。 native 浏览器除外。

元标记:

<meta name="HandheldFriendly" content="true">
<meta name="viewport" content="width=device-width">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1.0, user-scalable=no">

为移动设备设置的媒体查询是:

@media screen and (min-device-width : 320px) and (max-device-width : 667px){}

@media screen and (min-device-width : 320px) and (max-device-width : 667px) and (orientation : portrait) {}

@media screen and (min-device-width : 320px) and (max-device-width : 667px) and (orientation:landscape){}

Answer 1

@media 是一个较少使用的标签，你应该避免使用它，只有少数浏览器支持它，而主要的移动浏览器如 Safari、UC 不支持它。所以尝试以其他方式编写你的代码......考虑这个链接 - http://www.instructables.com/id/Make-your-HTML-Website-suitable-for-Mobile-Devices/ @media 无论如何都是大多数浏览器不支持的标签，因为现代设备认为它们是高分辨率的，而不是需要@media 标签的设备，例如手持设备或自定义设置。@media 仅适用于打印等目的..