通过订单优先级覆盖媒体查询

600px媒体查询未应用。既然它有订单优先顺序，它不应该适用吗？通过订单优先级覆盖媒体查询

#mydiv {color:#FF0000;} 
@media screen and (max-width:750px){ 
    #mydiv {color:#000;} 
} 
@media screen and (max-width:600px){ 
    #mydiv {color:#33CC33;} 
} 

<div id="mydiv"> 
    testing text color with media queries 
</div>

http://jsfiddle.net/xpnGh/3/

来源

2013-05-31 4thSpace

我有同样的问题。三所学校在那里没有说清楚。如果您查看了Chrome开发人员面板并进行了一些实验，您会发现* *最新媒体查询*执行级别适用于多个类别*的优先级。所以说你是否给了'mydiv1'一个大于750px的属性，'mydiv2'是大于600px，并且声明了一个class ='mydiv1 mydiv2'的div并且有一个1000px的屏幕，其中两个类通过规则'mydiv2'将优先，不管顺序如何（='mydiv1 mydiv2'，='mydiv2 mydiv1'）。 – powersource97

你的样品在这里工作正常，在Chrome与夜间3种颜色？

然而，在位次永远算，是明确的：

@media screen and (max-width:750px) and (min-width:601px)

会解决任何问题的时候了，使你的代码更易于维护。

来源

2013-05-31 21:49:11

通过订单优先级覆盖媒体查询

回答

相关问题