7 Media types

One of the most important features of style sheets is that they
specify how a document is to be presented on different media: on the
screen, on paper, with a speech synthesizer, with a braille device,
etc.

Certain CSS properties are only designed for certain media (e.g.,
the 'cue-before' property for
aural user agents). On occasion, however, style sheets for different
media types may share a property, but require different values for
that property. For example, the 'font-size' property is useful both
for screen and print media. However, the two media are different
enough to require different values for the common property; a document
will typically need a larger font on a computer screen than on paper.
Experience also shows that sans-serif fonts are easier to read on
screen, while fonts with serifs are easier to read on paper. For
these reasons, it is necessary to express that a style sheet -- or a
section of a style sheet -- applies to certain media types.

An @media rule
specifies the target media types (separated
by commas) of a set of rules (delimited by curly braces). The @media construct allows style
sheet rules for various media in the same style sheet:

A CSS media
type names a set of CSS properties. A user agent that
claims to support a media type by name must implement all of the
properties that apply to that media type.

The names chosen for CSS media types reflect target devices for
which the relevant properties make sense. In the following list of CSS
media types, the parenthetical descriptions are not normative. They
only give a sense of what device the media type is meant to refer to.

Intended for paged, opaque material and for documents viewed on
screen in print preview mode. Please consult the section on paged media for information about formatting
issues that are specific to paged media.

projection

Intended for projected presentations, for
example projectors or print to transparencies.
Please consult the section on paged media for
information about formatting issues that are specific to paged media.

screen

Intended primarily for color computer screens.

tty

Intended for media using a fixed-pitch character grid, such as
teletypes, terminals, or portable devices with limited display
capabilities. Authors should not use pixel units with the "tty" media
type.

Each CSS property definition specifies the media types for which
the property must be implemented by a conforming user agent. Since
properties generally apply to several media, the "Applies to media"
section of each property definition lists media groups rather than individual media
types. Each property applies to all media types in the media groups
listed in its definition.

CSS2 defines the following media groups:

continuous
or paged.
"Both" means that the property in question applies to both media groups.