我正在为不同的vieqport或设备宽度定义多个CSS媒体查询......
所以我的问题是可以2 CSS Media Query定义块重叠或仅应用第一个匹配。它是如何工作的？
申请多个设备的正确方法是什么..我指的是定义的顺序？
答案 0 :(得分：2)
您可以在逗号分隔列表中组合多个媒体查询;如果 列表中的任何媒体查询都是真的，相关的样式 表格已应用。这相当于逻辑“或”操作。
https://developer.mozilla.org/en/CSS/Media_queries
所以
这相当于逻辑“或”操作
使它看起来只应用了一个匹配。
http://reference.sitepoint.com/css/mediaqueries似乎也证实了这一点。
如果这是真的（并且我未经测试），那么无论匹配什么媒体查询，我都会创建一个通用样式表来提供所有常见样式，然后为每个目标设备提供具有其他样式的设备独立样式表。
答案 1 :(得分：0)
这很奇怪。如果你写：
<link media="screen and (max-width: 1250px)" href="/css/small.css" type="text/css" rel="stylesheet" />
<link media="screen and (max-height: 850px)" href="/css/small.css" type="text/css" rel="stylesheet" />
它就像一个XOR（有2个样式表）。如果满足两个条件（宽度<1250和高度<850），则不应用样式表。 但如果你写：
<link media="screen and (max-width: 1250px), screen and (max-height: 850px)" href="/css/small.css" type="text/css" rel="stylesheet" />
工作正常。所以逗号就是一切的解决方案。