Selectors - CSS Reference - page 89

and

Links together two or more media features in such a way that all of them must be true
for the query to be true. For example, (color) and (orientation: landscape) and
(min-device-width: 800px) means that all three conditions must be satisfied: if the me-
dia environment has color, is in landscape orientation, and the device's display is at least
800 pixels wide, the style sheet is used.

not

Negates the entire query so that if all of the conditions are true, the style sheet is notap-
plied. For example, not (color) and (orientation: landscape) and (min-device-
width: 800px) means that if the three conditions are satisfied, the statement is negated.
Thus, if the media environment has color, is in landscape orientation, and the device's dis-
play is at least 800 pixels wide, the style sheet is notused. In all other cases, it will be
used. Note that the not keyword can only be used at the beginning of a media query. It is
notlegal to write something like (color) and not (mid-device-width: 800px) . In
such cases, the query will be ignored. Note also that browsers too old to understand media
queries will always skip a style sheet whose media descriptor starts with not .

There is no or keyword for use within a given query. The commas that separate a list of quer-
ies do serve the function of an or — screen, print means “apply if the media is screen or
print.” Thus, instead of screen and (max-color: 2) or (monochrome) , which is invalid
and thus ignored, you should write screen and (max-color: 2), screen and (mono-
chrome) .
There is one more keyword, only , which is designed to create deliberate backward incompat-
ibility.

only

Used to hide a style sheet from browsers too old to understand media queries. For ex-
ample, to apply a style sheet in all media, but only in those browsers that understand media
queries, you write something like @import url(new.css) only all . In browsers that
do understand media queries, the only keyword is ignored. Note that the only keyword
can only be used at the beginning of a media query.

Media Query Values

There are two new value types introduced by media queries, which (as of early 2011) are not
used in any other context.