我有 4 个媒体查询。第一个、第三个和第四个工作,但第二个似乎没有激活。
为什么 480x720(第二个媒体查询)默认为第一个媒体查询?
@media screen and (max-width: 320px) and (orientation: portrait) { body{background:#F0F;} }
@media screen and (min-width: 321px) and (max-width: 480px) and (orientation: portrait) { body{background:#F00;} }
@media screen and (max-width: 480px) and (orientation: landscape) { body{background:#0F0;} }
@media screen and (min-width: 481px) and (max-width: 800px) and (orientation: landscape) { body{background:#FF0;} }
预期的结果:
实际发生了什么:
为什么 480x720(第二个媒体查询)默认为第一个媒体查询?
最佳答案
我是 android 和 CSS 的新手。
我在我的 index.html 文件的标题中用一行解决了 android 不给它们真实大小的问题:
<meta name="viewport" content="width=device-width" />
从那时起,我的 CSS 文件就如我所料!
关于android - 媒体查询在 Android 上的行为不符合预期,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/6047884/