我可以使用“OR”在CSS媒体查询？ [英] Can I use "OR" in a CSS media query?

问题描述

我尝试将以下三个媒体查询合并为一个：

  @media only screen and（max-device -width：480px）{
} 
 
 @media only screen and（-webkit-min-device-pixel-ratio：2）{
} 
 
 @media only screen and（max-device-width：1024px）{
} 
  

我尝试了下面的，但它不工作：

  @media only屏幕和（max-device-width ：480px），
 @media only screen and（-webkit-min-device-pixel-ratio：2），
 @media only screen and（max-device-width：1024px）{$ b $有没有办法组合这些，可能有一个或？
解决方案
从规范 
 
 
下面是使用CSS中的@ media-rule的逗号分隔列表中的几个媒体查询的示例：
  @media screen and（color），projection and（color）{...}  
 
 
只能在规则开头使用 @media 。
 
I'm trying to combine the following three media queries into one:
@media only screen and (max-device-width: 480px) {
}

@media only screen and (-webkit-min-device-pixel-ratio: 2) {
}

@media only screen and (max-device-width: 1024px) {
}
I've tried this below, but it doesn't work:
@media only screen and (max-device-width: 480px),
@media only screen and (-webkit-min-device-pixel-ratio: 2),
@media only screen and (max-device-width: 1024px) {
}
Is there a way to combine these, possibly with an "OR"?
解决方案
From the specification

  
Here is an example of several media queries in a comma-separated list using the an @media-rule in CSS:
  @media screen and (color), projection and (color) { … }
Only use @media at the start of the rule.

                        
这篇关于我可以使用“OR”在CSS媒体查询？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！