Some properties are only for particular media (e.g.,
cue-before
: aural user agents).
media types may share a property, but require different values.
For example font-size
is useful both
for screen and print media. , the two media are different
enough to require different values ; a document
will typically need a larger font on a computer screen than on paper.
sans-serif
fonts are easier to read on screen,
serifs
are easier to read on paper.
Sections of a style sheet -- applies to certain media types.
link
<HEAD> <LINK rel="stylesheet" type="text/css" media="print, handheld" href="foo.css"> </HEAD>
@media
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:
@media print { BODY { font-size: 10pt } } @media screen { BODY { font-size: 12pt } } @media screen, print { BODY { line-height: 1.2 } }
@import
@import url("loudvoice.css") aural; }
all
|
Media | Groups | |||
---|---|---|---|---|
aural | continuous | aural | N/A | interactive |
braille | continuous | tactile | grid | interactive |
emboss | paged | tactile | grid | interactive |
handheld | both | visual | both | interactive |
paged | visual | bitmap | ||
projection | paged | visual | bitmap | |
screen | continuous | visual | bitmap | interactive |
tty | continuous | visual | grid | interactive |
tv | both | visual, aural | bitmap | interactive |