HTML and CSS Reference
In-Depth Information
The
@import
CSS2 media types are the same as those for the
<style>
tag's
media
attribute, including
all, aural, braille, embossed, handheld,
print, projection, screen, tty
, and
tv
.
Another CSS2 way to select media is through the explicit
@media
at-rule,
which lets you include media-specific rules within the same stylesheet,
either at the document level or in an external stylesheet. At the docu-
ment level, as with
@import
, the
@media
at-rule must appear within the
contents of the
<style>
tag. The at-rules may not appear within another
rule. Unlike
@import, @media
may appear subsequent to other style rules,
and its style-rule contents override previous rules according to the cas-
cading standard.
The contents of
@media
include one or more comma-separated media-
type keywords followed by a curly brace (
{}
)-enclosed set of style rules.
For example:
body {background: white}
@media tv, projection {
body {background: yellow}
}
The
yellow
attribute to the
@media
at-rule causes the body's background
color to display yellow, rather than the default white set in the general
style rule, when the document is rendered on a television or projection
screen (as specified by the
tv
and
projection
attributes).
8.1.6. Linked Versus Imported Stylesheets
At first glance, it may appear that linked and imported stylesheets are
equivalent, using different syntax for the same functionality. This is
true if you use just one
<link>
tag in your document. However, special
CSS2-standard rules come into play if you include two or more
<link>
tags within a single document.
