组合CSS媒体查询

前端之家收集整理的这篇文章主要介绍了组合CSS媒体查询前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
我想为打印页面(media = print)的人和在手机上浏览的人显示相同的CSS样式集。有没有办法我可以结合CSS媒体查询

就像是

@media only print or @media only screen and (max-device-width: 480px) {

     #container {
         width: 480px;
     }
}

解决方法

用逗号分隔它们:
@media only print,only screen and (max-device-width: 480px)

See the spec,特别是实施例VI(加重部分):

Several media queries can be combined in a media query list. A
comma-separated list of media queries. If one or more of the media
queries in the comma-separated list are true,the whole list is true,
and otherwise false. In the media queries Syntax,the comma expresses
a logical OR
,while the ‘and’ keyword expresses a logical AND.

我怀疑第二个只需要,所以你可以做:

@media only print,screen and (max-device-width: 480px)

猜你在找的CSS相关文章