CSS媒体查询：max-width和max-height

Question

我想在媒体查询中使用AND条件。我使用以下代码，但它不起作用

@media screen and (max-width: 995px AND max-height: 700px) {
}

Answer 1

它缺少逻辑运算符之前和之后的闭括号和左括号

@media (max-width: 995px) and (max-height: 700px) { ... }

Answer 2

写这个的正确和最简单的方法是：

@media screen and (max-width: 995px) and (max-height: 700px) {

}

Answer 3

使用逗号指定两个（或更多）不同的规则：

@media screen and (max-width: 995px) , screen and (max-height: 700px) {
 ...
}

来自https://developer.mozilla.org/en/CSS/Media_queries/

...此外，您可以在逗号分隔列表中组合多个媒体查询;如果列表中的任何媒体查询为true，则应用关联的样式表。这相当于逻辑＆＃34;或＆＃34;操作