11<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
22<html lang="en">
3- <!-- $Id: media.src,v 2.11 1998-03-14 23:42:28 ijacobs Exp $ -->
3+ <!-- $Id: media.src,v 2.12 1998-03-15 22:49:18 bbos Exp $ -->
44<HEAD>
55<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
66<TITLE>Media types</TITLE>
@@ -37,15 +37,15 @@ style sheets:</p>
3737<UL>
3838
3939<LI>Specify the target medium from a style sheet with the <span
40- class="index-def " title="@media">@media</span> or <span
41- class="index-def " title="@import">@import</span> at-rules.
40+ class="index-inst " title="@media">@media</span> or <span
41+ class="index-inst " title="@import">@import</span> at-rules.
4242
4343<div class="example"><P>
4444<PRE>
45- @import url(loudvoice.css) aural;
46- @media print {
47- /* style sheet for print goes here */
48- }
45+ @import url(loudvoice.css) aural;
46+ @media print {
47+ /* style sheet for print goes here */
48+ }
4949</PRE>
5050</div>
5151
@@ -56,25 +56,29 @@ element specifies the target medium of an external style sheet:
5656<div class="html-example"><P>
5757
5858<PRE>
59- <HTML>
60- <HEAD>
61- <TITLE>Link to a target medium</TITLE>
62- <LINK rel="stylesheet" type="text/css"
63- media="print" href="foo.css">
64- </HEAD>
65- <BODY>
66- <P>The body...
67- </BODY>
68- </HTML>
59+ <HTML>
60+ <HEAD>
61+ <TITLE>Link to a target medium</TITLE>
62+ <LINK rel="stylesheet" type="text/css"
63+ media="print" href="foo.css">
64+ </HEAD>
65+ <BODY>
66+ <P>The body...
67+ </BODY>
68+ </HTML>
6969</PRE>
7070</div>
7171</UL>
7272
73+ <p>The <a href="cascade.html#at-import">@media</a> rule is defined in
74+ the <a href="cascade.html">chapter on the cascade</a>.
75+
76+
7377<H3><a name="at-media-rule">The @media rule</a></H3>
7478
75- <P>An @media rule lists the <a href="#media-types"> media types</a>
76- (separated by commas) affected by a set of rules delimited by curly
77- braces.
79+ <P>An <span class="index-def" title="media">@ media</span> rule lists
80+ the <a href="#media-types">media types</a> (separated by commas)
81+ affected by a set of rules delimited by curly braces.
7882
7983<p>The <span class="index-inst" title="@media">@media</span> construct
8084allows style sheet rules for various media in the same style
@@ -92,47 +96,6 @@ sheet:</P>
9296 }
9397</pre>
9498
95- <H3><a name="at-import">The @import rule</a></h3>
96-
97- <P>The <span class="index-def"
98- title="@import"><dfn>'@import'</dfn></span> rule allows users to embed
99- style sheets in other style sheets. The '@import' keyword must be
100- followed by the name of the style sheet to include. Any @import rules
101- must precede all rule sets in a style sheet (see the section on <a
102- href="syndata.html#at-rules">at-rules</a> for more information).
103-
104- <div class="example"><P>
105- Both of these import rules are valid; the
106- first one illustrates that the "url()" syntax may be dropped in an
107- @import rule:</p>
108-
109- <PRE>
110- @import "mystyle.css";
111- @import url(herstyle.css);
112- </PRE>
113- </div>
114-
115- <p>So that user agents can avoid retrieving resources for unsupported
116- media types, authors may specify media-dependent <span
117- class="index-inst" title="@import"><a
118- href="syndata.html">@import</a></span> rules. These <span
119- class="index-def" title="conditional import|media-dependent
120- import">conditional imports</span> specify comma-separated media types
121- after the URI.
122-
123- <div class="example">
124- <p>The following rules have the same effect as if the imported style
125- sheet were wrapped in an @media rule for the same media, but it may
126- save the UA a fruitless download.
127-
128- <pre>
129- @import url(fineprint.css) print;
130- @import url(bluish.css) projection, tv;
131- </pre>
132- </div>
133-
134- <p>In the absence of any media types, the import is
135- unconditional. Specifying 'all' for the medium has the same effect.
13699
137100<H2><a name="media-types">Recognized media types</a></H2>
138101
0 commit comments