WD-css3-syntax-20030813 110 KB

Raw Blame History Permalink

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<!-- vim:expandtab:tabstop=2:shiftwidth=2:textwidth=72:
  -->

<html><!-- the command line to process is this is:

num -l 2 template.html | toc -l 2 | incl | xref | index |\
perl -I../bin ../bin/propindex | cite-mkbib ../biblio.ref \
>template-processed.html


To do: add longdesc

-->

<head>
<title>CSS3 module: Syntax</title>

<link href="default.css" rel="stylesheet" type="text/css">

<link href="http://www.w3.org/StyleSheets/TR/W3C-WD" rel="stylesheet"
type="text/css">

<body>
<div class="head">
<p><a class="logo" href="http://www.w3.org/" rel="home"><img alt="W3C"
height="48" src="http://www.w3.org/Icons/w3c_home" width="72"></a>

<h1 id="css3-module">CSS3 module: Syntax</h1>

<h2 class="no-num no-toc" id="w3c-working">W3C Working Draft 13 August 2003</h2>

<dl>
<dt>This version:

<dd><a
href="http://www.w3.org/TR/2003/WD-css3-syntax-20030813">http://www.w3.org/TR/2003/WD-css3-syntax-20030813</a>

<dt>Latest version:

<dd><a
href="http://www.w3.org/TR/css3-syntax">http://www.w3.org/TR/css3-syntax</a>

<dt>Previous version:

<dd>none

<dt>Editor:

<dd><a href="http://dbaron.org/">L. David Baron</a>, &lt;<a
href="mailto:dbaron@dbaron.org">dbaron@dbaron.org</a>&gt;

<dt>Additional Contributors:

<dd>Original CSS2 Authors

<dd>Bert Bos (W3C), &lt;<a href="mailto:bert@w3.org">bert@w3.org</a>&gt;

<dd>Peter Linss (Netscape)
</dl>
<!--begin-copyright-->
<p class="copyright"><a
href="http://www.w3.org/Consortium/Legal/ipr-notice#Copyright"> Copyright</a>
&copy; 2003 <a href="http://www.w3.org/"><abbr title="World Wide Web
Consortium">W3C</abbr></a><sup>&reg;</sup> (<a
href="http://www.lcs.mit.edu/"><abbr title="Massachusetts Institute of
Technology">MIT</abbr></a>, <a href="http://www.ercim.org/"><acronym
title="European Research Consortium for Informatics and
Mathematics">ERCIM</acronym></a>, <a href="http://www.keio.ac.jp/">Keio</a>),
All Rights Reserved. W3C <a
href="http://www.w3.org/Consortium/Legal/ipr-notice#Legal_Disclaimer">liability</a>,
<a
href="http://www.w3.org/Consortium/Legal/ipr-notice#W3C_Trademarks">trademark</a>,
<a href="http://www.w3.org/Consortium/Legal/copyright-documents">document
use</a> and <a
href="http://www.w3.org/Consortium/Legal/copyright-software">software
licensing</a> rules apply.
<!--end-copyright-->
<hr title="Separator for header">
</div>

<h2 class="no-num no-toc" id="abstract">Abstract</h2>

<p>This CSS3 module describes the basic structure of CSS style sheets, some
of the details of the syntax, and the rules for parsing CSS style sheets. It
also describes (in some cases, informatively) how stylesheets can be linked
to documents and how those links can be media-dependent. Additional details
of the syntax of some parts of CSS described in other modules will be
described in those modules. The selectors module has a grammar for selectors.
Modules that define properties give the grammar for the values of those
properties, in a format described in this document.

<h2 class="no-num no-toc" id="status">Status of this document</h2>

<p><em>This section describes the status of this document at the time of its
publication. Other documents may supersede this document. A list of current
W3C publications and the latest revision of this technical report can be
found in the <a href="http://www.w3.org/TR/">W3C technical reports index</a>
at http://www.w3.org/TR/. The latest revision can also be found by following
the "Latest Version" link above.</em>

<p> This document is a draft of one of the modules of CSS Level 3 (CSS3).
Some parts of the document are derived from the CSS Level 1 and CSS Level 2
recommendations, and those parts are thus relatively stable. However, it is
otherwise an early draft, and considerable revision is expected in later
drafts, especially in formalization of error handling behavior, the
conformance requirements for partial implementations (given the
modularization of CSS3), and integration with other CSS3 modules.

<p>This document is a working draft of the CSS working group which is part of
the <a href="http://www.w3.org/Style/">style activity</a> (see <a
href="http://www.w3.org/Style/Activity">summary</a>).

<p>The working group would like to receive feedback: discussion takes place
on the (<a
href="http://lists.w3.org/Archives/Public/www-style/">archived</a>) public
mailing list <a
href="http://www.w3.org/Mail/Lists.html#www-style">www-style@w3.org</a> (see
<a href="http://www.w3.org/Mail/Request">instructions</a>). W3C Members can
also send comments directly to the CSS working group.

<p>This is a draft document and may be updated, replaced or obsoleted by
other documents at any time. It is inappropriate to cite this document as
other than work in progress. Its publication does not imply endorsement by
the W3C membership or the <a href="http://www.w3.org/Style/Group/">CSS &amp
FP Working Group</a> (<a
href="http://cgi.w3.org/MemberAccess/AccessRequest">members only</a>).

<p>Patent disclosures relevant to CSS may be found on the Working Group's
public <a href="http://www.w3.org/Style/CSS/Disclosures"
rel="disclosure">patent disclosure page.</a>

<p>This document may be available in translations in the future. The English
version of this specification is the only normative version.

<h2 class="no-num no-toc" id="contents">Table of contents</h2>
<!--begin-toc-->

<ul class="toc">
<li><a href="#dependencies"><span class="secno">1. </span>Dependencies on
other modules</a>

<li><a href="#introduction"><span class="secno">2. </span>Introduction</a>

<li><a href="#css-style"><span class="secno">3. </span>CSS style sheet
representation</a>
<ul class="toc">
<li><a href="#referring"><span class="secno">3.1. </span>Referring to
characters not represented in a character encoding</a>

<li><a href="#the-textcss"><span class="secno">3.2. </span>The <dfn
id="textcss">text/css</dfn> content type</a>
</ul>

<li><a href="#syntax"><span class="secno">4. </span>General syntax of CSS</a>

<ul class="toc">
<li><a href="#characters"><span class="secno">4.1. </span>Characters and
case</a>

<li><a href="#tokenization"><span class="secno">4.2. </span>Tokenization</a>

<li><a href="#grammar"><span class="secno">4.3. </span>Grammar</a>
<ul class="toc">
<li><a href="#principles"><span class="secno">4.3.1. </span>Principles of CSS
error handling</a>

<li><a href="#style"><span class="secno">4.3.2. </span>Style sheets</a>
</ul>

<li><a href="#keywords"><span class="secno">4.4. </span>Keywords</a>

<li><a href="#statements"><span class="secno">4.5. </span>Statements</a>

<li><a href="#at-rules"><span class="secno">4.6. </span><dfn
id="at-rules0">At-rules</dfn></a>

<li><a href="#blocks"><span class="secno">4.7. </span><dfn
id="blocks0">Blocks</dfn></a>

<li><a href="#rule-sets"><span class="secno">4.8. </span>Rule sets,
declaration blocks, and selectors</a>

<li><a href="#declarations"><span class="secno">4.9. </span>Declarations and
properties</a>

<li><a href="#comments"><span class="secno">4.10. </span><dfn
id="comments0">Comments</dfn></a>
</ul>

<li><a href="#error-handling"><span class="secno">5. </span>Rules for
handling parsing errors or unsupported features</a>
<ul class="toc">
<li><a href="#partial"><span class="secno">5.1. </span>Partial
implementations</a>
</ul>

<li><a href="#vendor-specific"><span class="secno">6. </span>Vendor-specific
extensions</a>
<ul class="toc">
<li><a href="#historical"><span class="secno">6.1. </span>Historical
notes</a>
</ul>

<li><a href="#associating"><span class="secno">7. </span>Associating style
sheets with documents</a>
<ul class="toc">
<li><a href="#media"><span class="secno">7.1. </span>Media types</a>
<ul class="toc">
<li><a href="#introduction0"><span class="secno">7.1.1. </span>Introduction
to media types</a>

<li><a href="#specifying"><span class="secno">7.1.2. </span>Specifying
media-dependent style sheets</a>

<li><a href="#at-media-rule"><span class="secno">7.1.3. </span>The
<code>@media</code> rule</a>

<li><a href="#media-types"><span class="secno">7.1.4. </span>Recognized media
types</a>

<li><a href="#extensions"><span class="secno">7.1.5. </span>Extensions to
media types</a>
</ul>

<li><a href="#associating-UA"><span class="secno">7.2. </span>User-agent
style sheets</a>

<li><a href="#associating-user"><span class="secno">7.3. </span>User style
sheets</a>

<li><a href="#associating-author"><span class="secno">7.4. </span>Author
style sheets</a>

<li><a href="#at-import"><span class="secno">7.5. </span>Style sheets
including other style sheets: the <code>@import</code> rule</a>
</ul>

<li><a href="#defining"><span class="secno">8. </span>Defining namespaces:
the <code>@namespace</code> rule</a>

<li><a href="#conf"><span class="secno">9. </span>Conformance</a>
<ul class="toc">
<li><a href="#definitions"><span class="secno">9.1. </span>Definitions</a>

<li><a href="#conf-UA"><span class="secno">9.2. </span>User agent
conformance</a>
<ul class="toc">
<li><a href="#error"><span class="secno">9.2.1. </span>Error conditions</a>
</ul>

<li><a href="#conf-SS"><span class="secno">9.3. </span>Style sheet
conformance</a>

<li><a href="#conf-AT"><span class="secno">9.4. </span>Authoring tool
conformance</a>
</ul>

<li><a href="#property-defs"><span class="secno">10. </span>Format of
property definitions in other modules</a>
<ul class="toc">
<li><a href="#property-def-value"><span class="secno">10.1. </span>Value</a>
<ul class="toc">
<li><a href="#initial"><span class="secno">10.1.1.
</span><code>initial</code> and <code>inherit</code> values</a>
</ul>

<li><a href="#property-def-initial"><span class="secno">10.2.
</span>Initial</a>

<li><a href="#property-def-applies"><span class="secno">10.3. </span>Applies
to</a>

<li><a href="#property-def-inherited"><span class="secno">10.4.
</span>Inherited</a>

<li><a href="#property-def-computed"><span class="secno">10.5.
</span>Computed value</a>

<li><a href="#property-def-percent"><span class="secno">10.6.
</span>Percentage values</a>

<li><a href="#media-groups"><span class="secno">10.7. </span>Media groups</a>

<li><a href="#shorthand"><span class="secno">10.8. </span>Shorthand
properties</a>
</ul>

<li><a href="#detailed-grammar"><span class="secno">11. </span>Appendix:
Second grammar</a>
<ul class="toc">
<li><a href="#grammar0"><span class="secno">11.1. </span>Grammar</a>

<li><a href="#lexical"><span class="secno">11.2. </span>Lexical scanner</a>
</ul>

<li><a href="#changes">Changes from CSS2</a>

<li><a href="#acknowledgments">Acknowledgments</a>

<li><a href="#references">References</a>
<ul class="toc">
<li><a href="#normative">Normative references</a>

<li><a href="#other">Other references</a>
</ul>

<li><a href="#index">Index</a>
</ul>
<!--end-toc-->

<hr>

<h2 id="dependencies"><span class="secno">1. </span>Dependencies on other
modules</h2>

<p>This CSS3 module depends on the following other CSS3 modules:

<ul>
<li>Selectors <a href="#SELECT" rel="biblioentry">[SELECT]</a>

<li>CSS3 module: Values &amp; Units <a href="#CSS3VAL"
rel="biblioentry">[CSS3VAL]</a>

<li>CSS3 module: Cascading &amp; Inheritance <a href="#CSS3CASCADE"
rel="biblioentry">[CSS3CASCADE]</a>
</ul>

<p>It has non-normative (informative) references to the following other CSS3
modules:

<ul>
<li>Media queries <a href="#MEDIAQ" rel="biblioentry">[MEDIAQ]</a>

<li>Generated Content <a href="#CSS3GENCON"
rel="biblioentry">[CSS3GENCON]</a>
</ul>

<h2 id="introduction"><span class="secno">2. </span>Introduction</h2>

<p>This specification describes the basic syntax of CSS3 and the syntax
conventions used in the property definitions spread through the CSS3 modules.
The syntax of CSS3 has some error-handling requirements for
forward-compatibility, but much of the error-handling behavior depends on the
user agent.

<h2 id="css-style"><span class="secno">3. </span>CSS style sheet
representation</h2>

<p>A CSS style sheet is a sequence of characters from the Universal Character
Set (see <a href="#ISO10646" rel="biblioentry">[ISO10646]</a>). For
transmission and storage, these characters must be <dfn id="encoded"
title="character encoding">encoded</dfn> by a character encoding that
supports the set of characters available in US-ASCII (e.g., ISO-8859-x,
Shift_JIS, etc.). A <span class="index" id="BOM">byte order mark
(BOM)</span>, as described in section 2.7 of <a href="#UNICODE310"
rel="biblioentry">[UNICODE310]</a>, that begins the sequence of characters
should not be considered, for purposes of applying the grammar below, as a
part of the style sheet. For a good introduction to character sets and
character encodings, please consult the HTML 4.0 specification (<a
href="#HTML40" rel="biblioentry">[HTML40]</a>, chapter 5). See also the XML
1.0 specification (<a href="#XML10" rel="biblioentry">[XML10]</a>, sections
2.2 and 4.3.3).

<p>When a style sheet is embedded in another document, such as in the STYLE
element or "style" attribute of HTML, the style sheet shares the character
encoding of the whole document.

<p>When a style sheet resides in a separate file, user agents must observe
the following <span class="index" id="priorities" title="character
encoding::user agent's determination of">priorities</span> when determining a
style sheet's <span class="index" id="character0" title="character
encoding::default|default::character encoding">character encoding</span>
(from highest priority to lowest):

<ol>
<li>A character encoding specified by a higher level protocol (e.g., the
"charset" parameter to the MIME type specified in an HTTP "Content-Type"
field). (The HTTP protocol (<a href="#HTTP11" rel="biblioentry">[HTTP11]</a>,
section 3.7.1) mentions ISO-8859-1 as a default character encoding when the
"charset" parameter is absent from the "Content-Type" header field. In
practice, this recommendation has proved useless because some servers don't
allow a "charset" parameter to be sent, and others may not be configured to
send the parameter. Therefore, user agents must not assume any default value
for the "charset" parameter, but must instead look for the <span
class="index" id="charset0"><a href="#charset">@charset</a></span> rule.)

<li>The <dfn id="charset">@charset</dfn> at-rule.

<li>Assume that the style sheet is UTF-8.
</ol>

<p>Since the third point differs from CSS1 and CSS2, authors should not rely
on user agents to assume that style sheets without encoding information are
UTF-8 encoded. Authors should specify the encoding using one of the first two
methods.

<p>At most one @charset rule may appear in an external style sheet &mdash; it
must <em>not</em> appear in an embedded style sheet &mdash; and it must
appear at the very start of the style sheet, not preceded by any characters
(except for the optional Byte Order Mark <a href="#BOM">described above)</a>.
After "@charset", authors specify the name of a character encoding. The name
must be a charset name as described in the IANA registry (See <a
href="#RFC2978" rel="biblioentry">[RFC2978]</a>. Also, see <a
href="#CHARSETS" rel="biblioentry">[CHARSETS]</a> for a complete list of
charsets). For example:

<div class="example">
<p> @charset "ISO-8859-1";
</div>

<p>This specification does not mandate which character encodings a user agent
must support. <span class="issue">[Should we require a certain minimal set,
such as UTF-8 and UCS2?]</span>

<p>Note that reliance on the @charset construct theoretically poses a problem
since there is no <em>a priori</em> information on how it is encoded. In
practice, however, the encodings in wide use on the Internet are either based
on ASCII, UTF-16, UCS-4, or (rarely) on EBCDIC. This means that in general,
the initial byte values of a style sheet enable a user agent to detect the
encoding family reliably, which provides enough information to decode the
@charset rule, which in turn determines the exact character encoding.

<div class="issue">[Should this specification describe how to handle encoding
errors? Can a user agent ignore the <code><a
href="#charset">@charset</a></code> rule if it's wrong? What if the user
agent does not support the encoding used? Should this specification describe
how to handle a <code><a href="#charset">@charset</a></code> rule that
specifies a character encoding that is incompatible with the family of
encodings used to decode the <code><a href="#charset">@charset</a></code>
rule (and BOM) itself?]</div>
<!-- More examples of good encodings to use? -IJ -->
<!-- Encodings not to use? (cf. HTML 4.0) -IJ -->

<h3 id="referring"><span class="secno">3.1. </span>Referring to characters
not represented in a character encoding</h3>

<p>A style sheet may have to refer to characters that cannot be represented
in the current character encoding. These characters must be written as <span
title="backslash escapes"><a href="#character">escaped</a></span> references
to ISO 10646 characters. These escapes serve the same purpose as numeric
character references in HTML or XML documents (see <a href="#HTML40"
rel="biblioentry">[HTML40]</a>, chapters 5 and 25).

<p>The character escape mechanism should be used when only a few characters
must be represented this way. If most of a style sheet requires escaping,
authors should encode it with a more appropriate encoding (e.g., if the style
sheet contains a lot of Greek characters, authors might use "ISO-8859-7" or
"UTF-8").

<p>Intermediate processors using a different character encoding may translate
these escaped sequences into byte sequences of that encoding. Intermediate
processors must not, on the other hand, alter escape sequences that cancel
the special meaning of an ASCII character.

<p><a href="#conformance">Conforming user agents</a> must correctly map to
Unicode all characters in any character encodings that they recognize (or
they must behave as if they did).

<p>For example, a style sheet transmitted as ISO-8859-1 (Latin-1) cannot
contain Greek letters directly: "&#954;&#959;&#965;&#961;&#959;&#962;"
(Greek: "kouros") has to be written as "\3BA\3BF\3C5\3C1\3BF\3C2".

<div class="note">
<p> <em><strong>Note.</strong> In HTML 4.0, numeric character references are
interpreted in "style" attribute values but not in the content of the STYLE
element. Because of this asymmetry, we recommend that authors use the CSS
character escape mechanism rather than numeric character references for both
the "style" attribute and the STYLE element. For example, we recommend:</em>

<pre class="html-example">
&lt;span style="voice-family: D\FC rst"&gt;...&lt;/span&gt;
</pre>

<p><em>rather than:</em>

<pre class="html-example">
&lt;span style="voice-family: D&amp;#252;rst"&gt;...&lt;/span&gt;
</pre>
</div>

<h3 id="the-textcss"><span class="secno">3.2. </span>The <dfn
id="textcss0">text/css</dfn> content type</h3>

<p>CSS style sheets that exist in separate files are sent over the Internet
as a sequence of bytes accompanied by encoding
information<!--(see <a href="#HTML40" rel="biblioentry">[HTML40]</a>, chapter 5)-->.
The structure of the transmission, termed a <dfn id="message" title="message
entity">message entity,</dfn> is defined by MIME and HTTP 1.1 (see <a
href="#RFC2045" rel="biblioentry">[RFC2045]</a> and <a href="#HTTP11"
rel="biblioentry">[HTTP11]</a>). A message entity with a content type of
"text/css" represents an independent CSS style sheet. The "text/css" content
type has been registered by RFC 2318 (<a href="#RFC2318"
rel="biblioentry">[RFC2318]</a>).

<h2 id="syntax"><span class="secno">4. </span>General syntax of CSS</h2>

<p>This section describes a grammar (and <dfn
id="forward-compatible">forward-compatible parsing</dfn> rules) common to any
version of CSS (including CSS3). Future versions of CSS will adhere to this
core syntax, although they may add additional syntactic constraints.

<p>See the <a href="#characters">section on characters and case</a> for
information on case-sensitivity.

<p>These descriptions are normative.

<h3 id="characters"><span class="secno">4.1. </span>Characters and case</h3>

<p> The following rules always hold:

<ul>
<li>
<p>All CSS style sheets are <span class="index" id="case-insensitive"
title="case sensitivity">case-insensitive</span>, except for parts that are
not under the control of CSS. For example, the case-sensitivity of values of
the HTML attributes "id" and "class", of font names, and of URIs lies outside
the scope of this specification. Note in particular that element names are
case-insensitive in HTML, but case-sensitive in XML.

<li>
<p>In CSS3, <dfn id="identifiers" title="identifier">identifiers</dfn>
(including element names, classes, and IDs in selectors (see <a
href="#SELECT" rel="biblioentry">[SELECT]</a> <span class="issue">[or is this
still true]</span>)) can contain only the characters [A-Za-z0-9] and ISO
10646 characters 161 and higher, plus the hyphen (-) and the underscore (_);
they cannot start with a digit or a hyphen followed by a digit. They can also
contain escaped characters and any ISO 10646 character as a numeric code (see
next item). <span class="example">For instance, the identifier
"<code>B&amp;W?</code>" may be written as "<code>B\&amp;W\?</code>" or
"<code>B\26 W\3F</code>".</span> (See <a href="#UNICODE310"
rel="biblioentry">[UNICODE310]</a> and <a href="#ISO10646"
rel="biblioentry">[ISO10646]</a>.)

<li>
<p>In CSS3, a backslash (\) character indicates three types of <dfn
id="character" title="backslash escapes">character escapes</dfn>.

<p>First, inside a string (see <a href="#CSS3VAL"
rel="biblioentry">[CSS3VAL]</a>), a backslash followed by a newline is
ignored (i.e., the string is deemed not to contain either the backslash or
the newline).

<p>Second, it cancels the meaning of special CSS characters. Any character
(except a hexadecimal digit) can be escaped with a backslash to remove its
special meaning. For example, <samp>"\""</samp> is a string consisting of one
double quote. Style sheet preprocessors must not remove these backslashes
from a style sheet since that would change the style sheet's meaning.

<p>Third, backslash escapes allow authors to refer to characters they can't
easily put in a style sheet. In this case, the backslash is followed by at
most six hexadecimal digits (0..9A..F), which stand for the ISO 10646 (<a
href="#ISO10646" rel="biblioentry">[ISO10646]</a>) character with that
number. If a digit or letter follows the hexadecimal number, the end of the
number needs to be made clear. There are two ways to do that:

<ol>
<li>with a space (or other whitespace character): "\26 B" ("&amp;B"). In this
case, user agents should treat a "CR/LF" pair (13/10) as a single whitespace
character.

<li>by providing exactly 6 hexadecimal digits: "\000026B" ("&amp;B")
</ol>

<p>In fact, these two methods may be combined. Only one whitespace character
is ignored after a hexadecimal escape. Note that this means that a "real"
space after the escape sequence must itself either be escaped or doubled.

<li>
<p>Backslash escapes are always considered to be part of an <span><a
href="#identifiers">identifier</a></span> or a string (i.e., "\7B" is not
punctuation, even though "{" is, and "\32" is allowed at the start of a class
name, even though "2" is not).
</ul>

<h3 id="tokenization"><span class="secno">4.2. </span>Tokenization</h3>

<p class="issue">[This needs to be integrated with the selectors module. How
should that be done?]

<p>All levels of CSS &mdash; level 1, level 2, level 3, and any future levels
&mdash; use the same core syntax. This allows UAs to parse (though not
completely understand) style sheets written in levels of CSS that didn't
exist at the time the UAs were created. Designers can use this feature to
create style sheets that work with older user agents, while also exercising
the possibilities of the latest levels of CSS.

<p>At the lexical level, CSS style sheets consist of a sequence of tokens.
Hexadecimal codes (e.g., <code>#x20</code>) refer to ISO 10646 (<a
href="#ISO10646" rel="biblioentry">[ISO10646]</a>). In case of multiple
matches, the longest match determines the token.

<p>The following productions are <em>parts</em> of tokens:

<p class="issue">[We need something to allow signs on integers. Do we need to
go as far as css3-selectors?]

<table>
<tbody>
<tr>
<td id="SUBTOK-ident">ident

<td>::=

<td><code>'-'? <a href="#SUBTOK-nmstart">nmstart</a> <a
href="#SUBTOK-nmchar">nmchar</a>*</code>

<tr>
<td id="SUBTOK-name">name

<td>::=

<td><code><a href="#SUBTOK-nmchar">nmchar</a>+</code>

<tr>
<td id="SUBTOK-nmstart">nmstart

<td>::=

<td><code>[a-zA-Z] | '_' | <a href="#SUBTOK-nonascii">nonascii</a> | <a
href="#SUBTOK-escape">escape</a></code>

<tr>
<td id="SUBTOK-nonascii">nonascii

<td>::=

<td><code>[#x80-#xD7FF#xE000-#xFFFD#x10000-#x10FFFF]</code>

<tr>
<td id="SUBTOK-unicode">unicode

<td>::=

<td><code>'\' [0-9a-fA-F]{1,6} <a href="#SUBTOK-wc">wc</a>?</code>

<tr>
<td id="SUBTOK-escape">escape

<td>::=

<td><code><a href="#SUBTOK-unicode">unicode</a> | '\'
[#x20-#x7E#x80-#xD7FF#xE000-#xFFFD#x10000-#x10FFFF]</code>

<tr>
<td id="SUBTOK-nmchar">nmchar

<td>::=

<td><code>[a-zA-Z0-9] | '-' | '_' | <a href="#SUBTOK-nonascii">nonascii</a> |
<a href="#SUBTOK-escape">escape</a></code>

<tr>
<td id="SUBTOK-num">num

<td>::=

<td><code>[0-9]+ | [0-9]* '.' [0-9]+</code>

<tr>
<td id="SUBTOK-string">string

<td>::=

<td><code>'"' (<a href="#SUBTOK-stringchar">stringchar</a> | "'")* '"' | "'"
(<a href="#SUBTOK-stringchar">stringchar</a> | '"')* "'"</code>

<tr>
<td id="SUBTOK-stringchar">stringchar

<td>::=

<td><code><a href="#SUBTOK-urlchar">urlchar</a> | #x20 | '\' <a
href="#SUBTOK-nl">nl</a></code>

<tr>
<td id="SUBTOK-urlchar">urlchar

<td>::=

<td><code>[#x9#x21#x23-#x26#x27-#x7E] | <a
href="#SUBTOK-nonascii">nonascii</a> | <a
href="#SUBTOK-escape">escape</a></code>

<tr>
<td id="SUBTOK-nl">nl

<td>::=

<td><code>#xA | #xD #xA | #xD | #xC</code>

<tr>
<td id="SUBTOK-w">w

<td>::=

<td><code><a href="#SUBTOK-wc">wc</a>*</code>

<tr>
<td id="SUBTOK-wc">wc

<td>::=

<td><code>#x9 | #xA | #xC | #xD | #x20</code>
</table>

<p>The following productions are the complete list of tokens in CSS3:

<table>
<tbody>
<tr>
<td id="TOK-IDENT">IDENT

<td>::=

<td><code><a href="#SUBTOK-ident">ident</a></code>

<tr>
<td id="TOK-ATKEYWORD">ATKEYWORD

<td>::=

<td><code>'@' <a href="#SUBTOK-ident">ident</a></code>

<tr>
<td id="TOK-STRING">STRING

<td>::=

<td><code><a href="#SUBTOK-string">string</a></code>

<tr>
<td id="TOK-HASH">HASH

<td>::=

<td><code>'#' <a href="#SUBTOK-name">name</a></code>

<tr>
<td id="TOK-NUMBER">NUMBER

<td>::=

<td><code><a href="#SUBTOK-num">num</a></code>

<tr>
<td id="TOK-PERCENTAGE">PERCENTAGE

<td>::=

<td><code><a href="#SUBTOK-num">num</a> '%'</code>

<tr>
<td id="TOK-DIMENSION">DIMENSION

<td>::=

<td><code><a href="#SUBTOK-num">num</a> <a
href="#SUBTOK-ident">ident</a></code>

<tr>
<td id="TOK-URI">URI

<td>::=

<td><code>"url(" <a href="#SUBTOK-w">w</a> (<a
href="#SUBTOK-string">string</a> | <a href="#SUBTOK-urlchar">urlchar</a>* )
<a href="#SUBTOK-w">w</a> ")"</code>

<tr>
<td id="TOK-UNICODE-RANGE">UNICODE-RANGE

<td>::=

<td><code>"U+" [0-9A-F?]{1,6} ('-' [0-9A-F]{1,6})?</code>

<tr>
<td id="TOK-CDO">CDO

<td>::=

<td><code>"&lt;!--"</code>

<tr>
<td id="TOK-CDC">CDC

<td>::=

<td><code>"--&gt;"</code>

<tr>
<td id="TOK-S">S

<td>::=

<td><code><a href="#SUBTOK-wc">wc</a>+</code>

<tr>
<td id="TOK-COMMENT">COMMENT

<td>::=

<td><code>"/*" [^*]* '*'+ ([^/] [^*]* '*'+)* "/"</code>

<tr>
<td id="TOK-FUNCTION">FUNCTION

<td>::=

<td><code><a href="#SUBTOK-ident">ident</a> '('</code>

<tr>
<td id="TOK-INCLUDES">INCLUDES

<td>::=

<td><code>"~="</code>

<tr>
<td id="TOK-DASHMATCH">DASHMATCH

<td>::=

<td><code>"|="</code>

<tr>
<td id="TOK-PREFIXMATCH">PREFIXMATCH

<td>::=

<td><code>"^="</code>

<tr>
<td id="TOK-SUFFIXMATCH">SUFFIXMATCH

<td>::=

<td><code>"$="</code>

<tr>
<td id="TOK-SUBSTRINGMATCH">SUBSTRINGMATCH

<td>::=

<td><code>"*="</code>

<tr>
<td id="TOK-CHAR">CHAR

<td>::=

<td>any other character not matched by the above rules, except for
<code>"</code> or <code>'</code>

<tr>
<td id="TOK-BOM">BOM

<td>::=

<td><code>#xFEFF</code>
</table>

<p> Since any single character other than ' or " that cannot be part of a
larger token is a single character token, there cannot be errors in
tokenization other than the inability to tokenize an unmatched quotation
mark. If at some point it is not possible to continue tokenizing an incoming
style sheet, the remainder of the style sheet should be ignored and only the
largest initial segment of the style sheet that can be tokenized according to
the above rules (that is, the entire style sheet except for the part from the
unmatched (single or double) quotation mark to the end) should be used to
form the sequence of tokens to be parsed according to the grammar.

<p class="issue">[This isn't exactly right. Since the string token can't
contain newlines that aren't escaped by backslashes, an untokenizable
sequence can occur in the middle of a file. Would it be better to change
things so that unmatched quotation marks become single-character tokens and
all character streams are tokenizable?]

<h3 id="grammar"><span class="secno">4.3. </span>Grammar</h3>

<h4 id="principles"><span class="secno">4.3.1. </span>Principles of CSS error
handling</h4>

<p>All levels of CSS, starting from CSS1, have required that user agents
ignore certain types of invalid style sheets in well-defined ways. This
allows forward-compatibility, since it allows future extensions to CSS within
basic grammatical constraints that will be ignored in well-defined ways by
user agents implementing earlier versions of CSS.

<p>Handling of CSS that is not valid CSS3 but is valid according to the
forward-compatible syntax requires first determining the beginning and end of
the part that is invalid and then handling that part in a specified way. The
latter is described in the <a href="#error-handling">rules for handling
parsing errors</a>. The mechanism for the former is described within the
grammar.

<p>The handling of style sheets that do not parse according to the
forward-compatible core syntax is not defined by this specification. <span
class="issue">[Should it be?]</span>

<p>Certain productions within the grammar are <dfn id="error0">error handling
points</dfn>. Every error handling point has a backup production that is to
be used if it is not possible to parse the stream of tokens based on the
primary production. If the error handling production is represented as
<code>prod</code>, then the backup production is represented as
<code>FAIL(prod)</code>.

<p class="issue">[The <a href="#detailed-grammar">grammar</a> given in
Appendix D of CSS2 still needs to be incorporated into this specification.
The editor hopes that it can be done by unifying it with the
forward-compatible grammar into a single grammar that describes both the
rules for forward-compatible parsing and the syntax of what is currently
possible in CSS, but that may not be possible. However, hopefully it will be
possible to do this by describing the general grammar in terms of the
concepts described in the previous paragraph.]

<p>Excluding the transformation of a production into its backup production,
this grammar is LL(1). <span class="issue">[We should explain briefly what
this means, except that it's probably not true. It's probably just
LALR(1).]</span>

<p>The portion of a CSS style sheet that is to be used is the largest initial
stream of the tokens resulting from the <a href="#tokenization">tokenization
process</a> that can be parsed according to the grammar presented in this
chapter. (For example, if a brace closing a declaration block <span
class="issue">[link-ify this]</span> is not present, the declaration block
must be ignored since the closing brace is required to satisfy this grammar.)
<span class="issue">[This might lead to highly unexpected behavior when
there's an extra closing brace (etc.). Do we really want this?]</span>

<p>Some of the constraints of CSS are not expressed in the grammar. For
example, an <code><a href="#charset">@charset</a></code> rule is not
permitted in an embedded style sheet, or a namespace prefix that has not been
defined by an <code>@namespace</code> rule is an invalid selector. These
constraints should be handled just as a parsing error would be (by ignoring
out to the next backup production) unless specified otherwise.

<h4 id="style"><span class="secno">4.3.2. </span>Style sheets</h4>

<p>Below is the core syntax for CSS. Lowercase identifiers represent
productions in this grammar, uppercase identifiers represent tokens (see
above), and characters in single quotes (') represent CHAR tokens (see
above). The sections that follow describe how to use it.

<p class="issue">[This might need better integration with the selectors
module, although maybe it's ok.]

<pre>
stylesheet  : [ CDO | CDC | S | statement ]*;
statement   : ruleset | at-rule;
at-rule     : ATKEYWORD S* any* [ block | ';' S* ];
block       : '{' S* [ any | block | ATKEYWORD S* | ';' S* ]* '}' S*;
ruleset     : selector? '{' S* declaration? [ ';' S* declaration? ]* '}' S*;
selector    : any+;
declaration : property ':' S* value;
property    : IDENT S*;
value       : [ any | block | ATKEYWORD S* ]+;
any         : [ IDENT | NUMBER | PERCENTAGE | DIMENSION | STRING
              | DELIM | URI | HASH | UNICODE-RANGE | INCLUDES
              | FUNCTION S* any* ')' | DASHMATCH | '(' S* any* ')'
              | '[' S* any* ']' ] S*;
</pre>

<div class="issue"> [The definitions of these productions should be spread
below into the prose describing what they mean. Furthermore, they should be
combined with the Appendix D grammar from CSS2, perhaps using notation like:
<table>
<tbody>
<tr>
<td>ruleset

<td>::=

<td>...

<tr>
<td>FAIL(ruleset)

<td>::=

<td>...
</table>
]</div>

<p><dfn id="comment">COMMENT</dfn> tokens do not occur in the grammar (to
keep it readable), but any number of these tokens may appear anywhere between
other tokens.

<p>The token S in the grammar above stands for <dfn
id="whitespace">whitespace</dfn>. Only the characters "space" (Unicode code
32), "tab" (9), "line feed" (10), "carriage return" (13), and "form feed"
(12) can occur in whitespace. Other space-like characters, such as "em-space"
(8195) and "ideographic space" (12288), are never part of whitespace.

<h3 id="keywords"><span class="secno">4.4. </span>Keywords</h3>
<!-- provide better explanation of where keywords appear:
media types, at-rules, etc. -IJ -->

<p>Keywords have the form of identifiers. Keywords must not be placed between
quotes ("..." or '...'). Thus,

<pre>
red
</pre>

<p>is a keyword, but

<pre>
"red"
</pre>

<p>is not. (It is a string.) Other illegal examples:

<div class="illegal-example">
<p>

<pre>
width: "auto";
border: "none";
background: "red";
</pre>
</div>

<h3 id="statements"><span class="secno">4.5. </span>Statements</h3>

<p>A CSS style sheet, for any version of CSS, consists of a list of <em
class="index" id="statements0">statements</em> (see the grammar above). There
are two kinds of statements: <em class="index" id="at-rules2"><a
href="#at-rules0">at-rules</a></em> and <em class="index" id="rule-"
title="rule sets">rule sets.</em> There may be <a
href="#whitespace">whitespace</a> around the statements.

<h3 id="at-rules"><span class="secno">4.6. </span><dfn
id="at-rules1">At-rules</dfn></h3>

<p> At-rules start with an <dfn id="at-keyword">at-keyword</dfn>, an '@'
character followed immediately by an <span><a
href="#identifiers">identifier</a></span> (for example, '@import', '@page').

<p> An at-rule consists of everything up to and including the next semicolon
(;) or the next <a href="#block">block,</a> whichever comes first. A CSS user
agent that encounters an unrecognized or misplaced at-rule must <span
class="index" id="ignore1"><a href="#ignore">ignore</a></span> the whole of
the at-rule and continue parsing after it.

<div class="illegal-example">
<p> Assume, for example, that a CSS3 parser encounters this style sheet:

<pre>
@import "subs.css";
h1 { color: blue }
@import "list.css";
</pre>

<p>The second '<code><a href="#import">@import</a></code>' is illegal
according to CSS3 since '<code><a href="#import">@import</a></code>' rules
must occur before all rules other than '<code><a
href="#charset">@charset</a></code>' rules. The CSS3 parser <span
class="index" id="ignores" title="ignore"><a
href="#ignore">ignores</a></span> the whole at-rule, effectively reducing the
style sheet to:

<pre>
@import "subs.css";
h1 { color: blue }
</pre>
</div>

<div class="illegal-example">
<p> In the following example, the second '@import' rule is invalid, since it
occurs inside a '@media' <a href="#block">block</a>.

<pre>
@import "subs.css";
@media print {
  @import "print-main.css";
  BODY { font-size: 10pt }
}
h1 {color: blue }
</pre>
</div>

<h3 id="blocks"><span class="secno">4.7. </span><dfn
id="blocks1">Blocks</dfn></h3>

<p> A <span class="index" id="block"><em>block</em></span> starts with a left
curly brace ({) and ends with the matching right curly brace (}). In between
there may be any characters, except that parentheses ((&nbsp;)), brackets
([&nbsp;]) and braces ({&nbsp;}) must always occur in matching pairs and may
be nested. Single (') and double quotes (") <!-- " --> must also occur in
matching pairs, and characters between them are parsed as a <span
class="index" id="string">string</span>. See <a
href="#tokenization">Tokenization</a> above for the definition of a string.

<div class="illegal-example">
<p> Here is an example of a block. Note that the right brace between the
double quotes does not match the opening brace of the block, and that the
second single quote is an <span title="backslash escapes"><a
href="#character">escaped character</a></span>, and thus doesn't match the
first single quote:

<pre>
{ causta: "}" + ({7} * '\'') }
</pre>

<p>Note that the above rule is not valid CSS3, but it is still a block as
defined above.
</div>

<h3 id="rule-sets"><span class="secno">4.8. </span>Rule sets, declaration
blocks, and selectors</h3>

<p> A rule set (also called "rule") consists of a selector followed by a
declaration block.

<p> A <dfn id="declaration-block">declaration-block</dfn> (also called a
{}-block in the following text) starts with a left curly brace ({) and ends
with the matching right curly brace (}). In between there must be a list of
zero or more semicolon-separated (;) declarations.

<p>The <dfn id="selector">selector</dfn> (see the Selectors module <a
href="#SELECT" rel="biblioentry">[SELECT]</a>) consists of everything up to
(but not including) the first left curly brace ({). A selector always goes
together with a {}-block. When a user agent can't parse the selector (i.e.,
it is not valid CSS3), it must <span class="index" id="ignore2"><a
href="#ignore">ignore</a></span> the {}-block as well.

<p>CSS3 gives a special meaning to the comma (,) in selectors. However, since
it is not known if the comma may acquire other meanings in future versions of
CSS, the whole statement should be <span class="index" id="ignored"
title="ignore"><a href="#ignore">ignored</a></span> if there is an error
anywhere in the selector, even though the rest of the selector may look
reasonable in CSS3.

<div class="illegal-example">
<p>For example, since the "&amp;" is not a valid token in a CSS3 selector, a
CSS3 user agent must <span class="index" id="ignore3"><a
href="#ignore">ignore</a></span> the whole second line, and not set the color
of H3 to red:

<pre>
h1, h2 {color: green }
h3, h4 &amp; h5 {color: red }
h6 {color: black }
</pre>
</div>

<div class="example">
<p>

<p>Here is a more complex example. The first two pairs of curly braces are
inside a string, and do not mark the end of the selector. This is a valid
CSS3 statement.

<pre>
p[example="public class foo\
{\
    private int x;\
\
    foo(int x) {\
        this.x = x;\
    }\
\
}"] { color: red }
</pre>

<div class="note">
<p> <em><strong>Note.</strong> The <span class="css">\</span> characters in
the above example cause the newlines to be ignored. Newlines can be placed in
strings only using the correct numeric character escape. See <a
href="#characters">characters and case</a> above. </em>
</div>
</div>

<h3 id="declarations"><span class="secno">4.9. </span>Declarations and
properties</h3>

<p> A <dfn id="declaration">declaration</dfn> is either empty or consists of
a <dfn id="property">property</dfn>, followed by a colon (:), followed by a
value. Around each of these there may be <a
href="#whitespace">whitespace</a>.

<p>Because of the way selectors work, multiple declarations for the same
selector may be organized into semicolon (;) separated groups.

<div class="example">
<p> Thus, the following rules:

<pre>
h1 { font-weight: bold }
h1 { font-size: 2em }
h1 { line-height: 1.2 }
h1 { font-family: Helvetica, Arial, sans-serif }
h1 { font-variant: normal }
h1 { font-style: normal }
</pre>

<p>are equivalent to:

<pre>
h1 {
  font-weight: bold;
  font-size: 2em;
  line-height: 1.2;
  font-family: Helvetica, Arial, sans-serif;
  font-variant: normal;
  font-style: normal
}
</pre>
</div>

<p>A property is an <span><a href="#identifiers">identifier</a></span>. Any
character may occur in the value, but parentheses ("(&nbsp;)"), brackets
("[&nbsp;]"), braces ("{&nbsp;}"), single quotes (') and double quotes (")
<!-- " --> must come in matching pairs, and semicolons not in strings must be
<span title="backslash escapes"><a href="#character">escaped</a></span>.
Parentheses, brackets, and braces may be nested. Inside the quotes,
characters are parsed as a string.

<p>The syntax of <dfn id="values" title="value">values</dfn> is specified
separately for each property, but in any case, values are built from
identifiers, strings, numbers, lengths, percentages, URIs, colors, angles,
times, and frequencies.

<p>A user agent must <span class="index" id="ignore4"><a
href="#ignore">ignore</a></span> a declaration with an invalid property name
or an invalid value. Every CSS3 property has its own syntactic and semantic
restrictions on the values it accepts.

<div class="illegal-example">
<p> For example, assume a CSS3 parser encounters this style sheet:

<pre>
h1 { color: red; font-style: 12px }  /* Invalid value: 12px */
p { color: blue;  font-vendor: any;  /* Invalid prop.: font-vendor */
    font-variant: small-caps }
em em { font-style: normal }
</pre>

<p> The second declaration on the first line has an invalid value '12pt'. The
second declaration on the second line contains an undefined property
'font-vendor'. The CSS3 parser will <span class="index" id="ignore5"><a
href="#ignore">ignore</a></span> these declarations, effectively reducing the
style sheet to:

<pre class="example">
h1 { color: red; }
p { color: blue;  font-variant: small-caps }
em em { font-style: normal }
</pre>
</div>

<h3 id="comments"><span class="secno">4.10. </span><dfn
id="comments1">Comments</dfn></h3>

<p><span class="index" id="comments2"><a href="#comments0">Comments
</a></span> begin with the characters "/*" and end with the characters "*/".
They may occur anywhere between tokens, and their contents have no influence
on the rendering. Comments may not be nested.

<p>CSS also allows the SGML comment delimiters ("&lt;!--" and "--&gt;") in
certain places, but they do not delimit CSS comments. They are permitted so
that style rules appearing in an HTML source document (in the STYLE element)
may be hidden from pre-HTML 3.2 user agents. See the HTML 4.0 specification
(<a href="#HTML40" rel="biblioentry">[HTML40]</a>) for more information.

<h2 id="error-handling"><span class="secno">5. </span>Rules for handling
parsing errors or unsupported features</h2>

<p class="issue">[Hopefully (assuming it can be formalized within the rules
above) this section will not need so much detail and can be folded into the
previous section.]

<p>In some cases, user agents must ignore part of an illegal style sheet.
This specification defines <dfn id="ignore">ignore</dfn> to mean that the
user agent parses the illegal part according to the grammar above (in order
to find its beginning and end), but otherwise acts as if it had not been
there.

<p>If a style sheet cannot be parsed according to the grammar above, the user
agent must behave the same as it would if the style sheet had the smallest
sequence of characters removed from its end that would allow it to be parsed
according to the grammar.

<p>To ensure that new properties and new values for existing properties can
be added in the future, user agents are required to obey the following rules
when they encounter the following scenarios:

<ul>
<li><strong>Unknown properties.</strong> User agents must <span class="index"
id="ignore6"><a href="#ignore">ignore</a></span> a <a
href="#declarations">declaration</a> with an unknown property. For example,
if the style sheet is:
<pre class="illegal-example">
h1 { color: red; rotation: 70minutes }
</pre>

<p> the user agent will treat this as if the style sheet had been

<pre class="example">
H1 { color: red }
</pre>

<li id="illegalvalues"><strong>Illegal values.</strong> User agents must
ignore a declaration with an illegal value. For example:
<pre class="illegal-example">
img { float: left }       /* correct CSS3 */
img { float: left here }  /* "here" is not a value of 'float' */
img { background: "red" } /* keywords cannot be quoted in CSS3 */
img { border-width: 3 }   /* a unit must be specified for length values */
</pre>
A CSS3 parser would honor the first rule and <span class="index"
id="ignore7"><a href="#ignore">ignore</a></span> the rest, as if the style
sheet had been:
<pre class="example">
img { float: left }
img { }
img { }
img { }
</pre>

<p>A user agent conforming to a future CSS specification may accept one or
more of the other rules as well.

<p class="issue">[A general comment on how to handle negative numbers when
disallowed might be useful. It should be a parsing error (and thus ignored).
We might want to add additional grammar productions for potentially negative
numbers.]

<li><strong>Malformed declarations.</strong> User agents must handle
unexpected tokens encountered while parsing a declaration by reading until
the end of the declaration, while observing the rules for matching pairs of
(), [], {}, "", and '', and correctly handling escapes. For example, a
malformed declaration may be missing a property, colon (:) or value. The
following are all equivalent:
<pre class="example"><code>
p { color:green }
p { color:green; color }  /* malformed declaration missing ':', value */
p { color:red;   color; color:green }  /* same with expected recovery */
p { color:green; color: } /* malformed declaration missing value */
p { color:red;   color:; color:green } /* same with expected recovery */
p { color:green; color{;color:maroon} } /* unexpected tokens { } */
p { color:red;   color{;color:maroon}; color:green } /* same with recovery */
</code></pre>

<li><strong>Invalid at-keywords.</strong> User agents must <span
class="index" id="ignore8"><a href="#ignore">ignore</a></span> an invalid
at-keyword together with everything following it, up to and including the
next semicolon (;) or block ({...}), whichever comes first. For example,
consider the following:
<pre class="illegal-example">
@three-dee {
  @background-lighting {
    azimuth: 30deg;
    elevation: 190deg;
  }
  h1 { color: red }
}
h1 { color: blue }
</pre>

<p> The '@three-dee' at-rule is not part of CSS3. Therefore, the whole
at-rule (up to, and including, the third right curly brace) is <span
class="index" id="ignored." title="ignore"><a
href="#ignore">ignored.</a></span> A CSS3 user agent <span class="index"
id="ignores0" title="ignore"><a href="#ignore">ignores</a></span> it,
effectively reducing the style sheet to:

<pre class="example">
h1 { color: blue }
</pre>

<li id="unsupportedvalues">
<p><strong>Unsupported Values</strong>If a UA does not support a particular
value, it should <em><a href="#ignore">ignore</a></em> that value when
parsing stylesheets, as if that value was an <a href="#illegalvalues">illegal
value</a>. For example:

<div class="example">
<pre>
  h3 {
    display: inline;
    display: run-in;
  }
</pre>
</div>

<p> A UA that supports the 'run-in' value for the 'display' property will
accept the first display declaration and then "write over" that value with
the second display declaration. A UA that does not support the 'run-in' value
will process the first display declaration and ignore the second display
declaration.
</ul>

<h3 id="partial"><span class="secno">5.1. </span>Partial implementations</h3>

<p>CSS3, unlike CSS1 and CSS2, is modular and thus allows for partial
implementations. The conformance requirements of some modules may also allow
for conformant implementations to implement only part of a module.

<p>Implementations that do not implement a feature of any CSS3 module
(whether a property, an at-rule, or a property value) should behave as they
would according to the forward-compatible parsing rules had that feature not
been part of a known CSS specification.

<h2 id="vendor-specific"><span class="secno">6. </span>Vendor-specific
extensions</h2>

<p>Although proprietary extensions should be avoided in general, there are
situations (experiments, implementations of W3C drafts that have not yet
reached Candidate Recommendation, intra-nets, debugging, etc.) where it is
convenient to add some nonstandard, i.e., proprietary identifiers to a CSS
style sheet. It is often hard to predict how long these proprietary
extensions will be in use and hard to avoid that their names clash with new,
standard properties or with other proprietary properties. Therefore the CSS
Working Group proposes the following simple naming convention. A proprietary
name should have a prefix consisting of:

<ol>
<li>an underscore ("_") or a dash ("-"),

<li>the (possibly abbreviated) name of the company, organization, etc. that
created it,

<li>an underscore or a dash.
</ol>

<p>Some examples (and the companies/organizations that created them):

<ul>
<li><em>-moz-box-sizing,</em> <em>-moz-border-radius</em> (The Mozilla
Organization)

<li><em>-wap-accesske</em>y (The WAP Forum)

<li><em>_xyz-dwiw</em> (hypothetical)
</ul>

<p>The advantage of the initial dash is that it is not a valid start
character for identifiers in CSS, so it is guaranteed never to be used by any
current or future level of CSS. CSS-conforming parsers will skip rules that
contain identifiers with such a character. <span class="issue">[Should the
grammar allow '-' as part of identifiers or should it require that vendors
who use '-' to begin identifiers extend the grammar in their tokenizer?
Currently it does, but perhaps it shouldn't.]</span>

<p>That is also a possible disadvantage: a conforming parser will skip them,
so in order to use them, an extended parser is required.

<p>For that reason, the underscore is also proposed. Although it is a valid
start character, the CSS Working Group believes it will never define any
identifiers that start with that character.

<h3 id="historical"><span class="secno">6.1. </span>Historical notes</h3>

<p><em>This section is informative, not normative.</em>

<p>Microsoft created a number of proprietary properties for use inside their
Microsoft Office product, at a time when there was not yet a consensus in the
working group about the naming convention. They chose to prefix properties
with "mso-" rather than "-mso-".

<p>At the time of writing, the following prefixes are known to exist:

<ul>
<li><em>mso-</em> (Microsoft Corporation)

<li><em>-moz-</em> (The Mozilla Organization)

<li><em>-opera-</em> (Opera Software)

<li><em>-atsc</em>- (Advanced Television Standards Committee)

<li><em>-wap-</em> (The WAP Forum)
</ul>

<h2 id="associating"><span class="secno">7. </span>Associating style sheets
with documents</h2>

<h3 id="media"><span class="secno">7.1. </span>Media types</h3>

<p class="issue">[This section lacks testable statements.]

<h4 id="introduction0"><span class="secno">7.1.1. </span>Introduction to
media types</h4>

<p>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.

<p>Certain CSS properties are only designed for certain media (e.g., the
<span class="propinst-page-break-before">'page-break-before'</span> property
only applies to paged media). On occasion, however, style sheets for
different media types may share a property, but require different values for
that property. For example, the <span
class="propinst-font-size">'font-size'</span> property is useful both for
screen and print media. The two media types 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. Therefore, it is necessary to
express that a style sheet, or a section of a style sheet, applies to certain
media types.

<h4 id="specifying"><span class="secno">7.1.2. </span>Specifying
media-dependent style sheets</h4>

<p>There are currently two ways to specify media dependencies for style
sheets:

<ul>
<li>Specify the target medium for a set of style rules with the <span
class="index" id="media2" title="@media"><a
href="#media0"><code>@media</code></a></span> at-rule.
<div class="example">
<p>

<pre>
@media print {
  /* style rules for print go here */
}
</pre>
</div>

<li>
<p>Specify the target media for an entire style sheet at the point where the
stylesheet is linked to the document.

<p>If the style sheet is linked to the document by being imported (with an <a
href="#at-import"><code>@import</code> rule</a>) from another style sheet,
the target media can be specified as part of the <span class="index"
id="import0" title="@import"><a
href="#import"><code>@import</code></a></span> at-rule:

<div class="example">
<pre>
@import url("fancyfonts.css") screen;
</pre>
</div>

<p>If the style sheet is linked to the document through a <a
href="#associating-author">linking mechanism within the document</a>, then it
may be possible to specify the target medium within the document language.
For example, in HTML 4.0 (<a href="#HTML40" rel="biblioentry">[HTML40]</a>),
the <code><a href="#media0">media</a></code> attribute on the
<code>link</code> element specifies the target media of an external style
sheet:

<div class="example">
<p>

<pre>
&lt;!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"&gt;
&lt;html&gt;
   &lt;head&gt;
      &lt;title&gt;Link to a target medium&lt;/title&gt;
      &lt;link rel="stylesheet" type="text/css"
	 media="print, handheld" href="foo.css"&gt;
   &lt;/head&gt;
   &lt;body&gt;
      &lt;p&gt;The body...
   &lt;/body&gt;
&lt;/html&gt;
</pre>
</div>
</ul>

<h4 id="at-media-rule"><span class="secno">7.1.3. </span>The <code><a
href="#media0">@media</a></code> rule</h4>

<p>An <dfn id="media0" title="@media"><code>@media</code></dfn> rule
specifies the target <a href="#media-types">media types</a> (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:

<div class="example">
<p>

<pre>
  @media print {
    body { font-size: 12pt; }
    h1 { font-size: 24pt; }
  }
  @media screen {
    body { font-size: medium; }
    h1 { font-size: 2em; }
  }
  @media screen, print {
    body { line-height: 1.2; }
  }
</pre>
</div>

<h4 id="media-types"><span class="secno">7.1.4. </span>Recognized media types</h4>

<p>A CSS <dfn id="media1">media type</dfn> 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. <span class="issue">[This needs
to be relaxed to deal with profiles.]</span> (For the 'all' media type, this
means that it must support all properties that apply to all media types.
<span class="issue">[Should all be removed from the list and separated to
make this more logical?]</span>)

<p>The names chosen for CSS media types reflect target devices for which the
relevant properties make sense. The names of media types are normative. In
the following list of CSS media types, the parenthetical descriptions are not
normative. Likewise, the "Media" field in the description of each property is
informative.

<dl>
<dt><strong>all</strong>

<dd>Suitable for all devices.

<dt><strong>braille</strong>

<dd>Intended for braille tactile feedback devices.

<dt><strong>embossed</strong>

<dd>Intended for paged braille printers.

<dt><strong>handheld</strong>

<dd>Intended for handheld devices (typically small screen, limited
bandwidth).

<dt><strong>print</strong>

<dd>Intended for paged material and for documents viewed on screen in print
preview mode. Please consult the paged media module <a href="#CSS3PAGE"
rel="biblioentry">[CSS3PAGE]</a> for information about formatting issues that
are specific to paged media.

<dt><strong>projection</strong>

<dd>Intended for projected presentations. Please consult the paged media
module <a href="#CSS3PAGE" rel="biblioentry">[CSS3PAGE]</a> for information
about formatting issues that are specific to paged media.

<dt><strong>screen</strong>

<dd>Intended primarily for color computer screens.

<dt><strong>speech</strong>

<dd>Intended for speech synthesizers. See the speech module <a
href="#CSS3SPEECH" rel="biblioentry">[CSS3SPEECH]</a> for details.

<dt><strong>tty</strong>

<dd>Intended for media using a fixed-pitch character grid (such as teletypes,
terminals, or portable devices with limited display capabilities).

<dt><strong>tv</strong>

<dd>Intended for television-type devices (low resolution, color,
limited-scrollability screens, sound available).
</dl>

<p>Media type names are case-insensitive.

<p>Media types are mutually exclusive in the sense that a user agent can only
support one media type when rendering a document. However, user agents may
have different modes which support different media types.

<div class="note">
<p> <em><strong>Note.</strong> Future versions of CSS may extend this list.
Authors should not rely on media type names that are not yet defined by a CSS
specification. </em>
</div>

<h4 id="extensions"><span class="secno">7.1.5. </span>Extensions to media
types</h4>

<p>The Media Queries Module <a href="#MEDIAQ" rel="biblioentry">[MEDIAQ]</a>
defines an extended mechanism for media type specification.

<h3 id="associating-UA"><span class="secno">7.2. </span>User-agent style
sheets</h3>

<h3 id="associating-user"><span class="secno">7.3. </span>User style sheets</h3>

<h3 id="associating-author"><span class="secno">7.4. </span>Author style
sheets</h3>

<p><em>This section is informative, not normative.</em>

<p class="issue">[This section should briefly summarize the mechanisms for
associating author style sheets with documents provided by <a href="#HTML40"
rel="biblioentry">[HTML40]</a>, <a href="#CSSSTYLEATTR"
rel="biblioentry">[CSSSTYLEATTR]</a> and <a href="#XMLSTYLE"
rel="biblioentry">[XMLSTYLE]</a>.]

<h3 id="at-import"><span class="secno">7.5. </span>Style sheets including
other style sheets: the <code><a href="#import">@import</a></code> rule</h3>

<p class="issue">[When this section is rewritten to define user agent
conformance more clearly, it should state that (1) the media list specified
in an @import rule prevents the import from being processed if the medium
doesn't match, but it doesn't "associate" the media with the style sheet so
that it can't be imported some other way. (2) @import without a medium must
ignore any medium specified for the same style sheet in a link from a
document.]

<p class="issue">[Should the discussion of how imported stylesheets affect
the cascade's notion of order be here or in <a href="#CSS3CASCADE"
rel="biblioentry">[CSS3CASCADE]</a>? It probably depends on which direction
the module dependency goes.]

<p>The <dfn id="import">'@import'</dfn> rule allows users to import style
rules from other style sheets. Any @import rules must follow all @charset
rules and precede all other at-rules and rule sets in a style sheet. The
'@import' keyword must be followed by the URI of the style sheet to include.
A string is also allowed; it will be interpreted as if it had url(...) around
it.

<div class="example">
<p> The following lines are equivalent in meaning and illustrate both
'@import' syntaxes (one with "url()" and one with a bare string):

<pre>
@import "mystyle.css";
@import url("mystyle.css");
</pre>
</div>

<p>So that user agents can avoid retrieving resources for unsupported <a
href="#media-types">media types</a>, authors may specify media-dependent
<span class="index" id="import1"><a href="#import">@import</a></span> rules.
These <dfn id="conditional" title="conditional import|media-dependent
import">conditional imports</dfn> specify comma-separated media types after
the URI.

<div class="example">
<p>The following rules illustrate how @import rules can be made
media-dependent:

<pre>
@import url("fineprint.css") print;
@import url("bluish.css") projection, tv;
</pre>
</div>

<p>In the absence of any media types, the import is unconditional. Specifying
'all' for the medium has the same effect.

<h2 id="defining"><span class="secno">8. </span>Defining namespaces: the
<code>@namespace</code> rule</h2>

<p>The @namespace rule allows the style sheet author to declare a namespace
prefix and associate it to a given namespace URI. The prefix applies only to
the style sheet in which it is declared, and not any style sheets imported by
that style sheet, style sheets that import that stylesheet, or any other
style sheets applying to the document. This namespace prefix can then be used
as a namespace prefix as described in other modules, for example the
Selectors Module <a href="#SELECT" rel="biblioentry">[SELECT]</a> or the
Generated Content module <a href="#CSS3GENCON"
rel="biblioentry">[CSS3GENCON]</a>. Any @namespace rules must follow all
@import and @charset rules and precede all other at-rules and rule sets in a
style sheet. This is to avoid any confusion or issues regarding the scope of
the declared namespace.

<p>If the optional namespace prefix is omitted, then the namespace URI is
considered to be the default namespace. The default namespace applies only to
type selectors that have no explicit namespace prefix declared as described
in the Selectors Module <a href="#SELECT" rel="biblioentry">[SELECT]</a>.

<p>A prefix, once declared, may be used in selectors and property values as
described in other modules. Those modules should define the use of a
namespace prefix that has not been properly declared as a parsing error that
will cause the selector or declaration (etc.) to be considered invalid and
ignored.

<p>If a namespace prefix is declared more than once, the last occurrence will
be used.

<div class="example">
<p>Examples:

<pre>@namespace url(http://www.w3.org/1999/xhtml);
@namespace svg url(http://www.w3.org/2000/svg);</pre>

<p>The first rule declares a default namespace
<code>http://www.w3.org/1999/xhtml</code> to be applied only to type
selectors that have no explicit namespace component.

<p>The second rule declares a namespace prefix <code>svg</code> that is used
to apply the namespace <code>http://www.w3.org/2000/svg</code> where the
<code>svg</code> namespace prefix is used.
</div>

<h2 id="conf"><span class="secno">9. </span>Conformance</h2>

<p>The key words <dfn id="must">"MUST"</dfn>, <dfn id="must-not">"MUST
NOT"</dfn>, <dfn id="required">"REQUIRED"</dfn>, <dfn
id="shall">"SHALL"</dfn>, <dfn id="shall0">"SHALL NOT"</dfn>, <dfn
id="should">"SHOULD"</dfn>, <dfn id="should0">"SHOULD NOT"</dfn>, <dfn
id="recommended">"RECOMMENDED"</dfn>, <dfn id="may">"MAY"</dfn>, and <dfn
id="optional">"OPTIONAL"</dfn> in this document are to be interpreted as
described in RFC&nbsp;2119 (see <a href="#RFC2119"
rel="biblioentry">[RFC2119]</a>). However, for readability, these words do
not appear in all uppercase letters in this specification.

<p>At times, this specification recommends good practice for authors and user
agents. These recommendations are not normative and conformance with this
specification does not depend on their realization. These recommendations
contain the expression "We recommend ...", "This specification recommends
...", or some similar wording.

<h3 id="definitions"><span class="secno">9.1. </span>Definitions</h3>

<p class="issue">[Some of these need heavy rewriting given modularization.
I've avoided substituting CSS3 where it's clearly not going to be
appropriate.]

<p>This module and other CSS3 modules rely on the following definitions:

<dl>
<dt><dfn id="style0">Style sheet</dfn>

<dd>A set of statements that specify presentation of a document.
<p>Style sheets may have three different origins: <a
href="#author">author</a>, <a href="#user">user</a>, and <a
href="#user-agent">user agent</a>. The interaction of these sources is
described in the cascading and inheritance module <a href="#CSS3CASCADE"
rel="biblioentry">[CSS3CASCADE]</a>.

<dt><dfn id="valid">Valid style sheet</dfn>

<dd>The validity of a style sheet depends on the level of CSS used for the
style sheet. All valid CSS1 style sheets are valid CSS&nbsp;2.1 style sheets,
but some changes from CSS1 mean that a few CSS1 style sheets will have
slightly different semantics in CSS&nbsp;2.1. Some features in CSS2 are not
part of CSS&nbsp;2.1, so not all CSS2 style sheets are valid CSS&nbsp;2.1
style sheets.
<p>A valid CSS&nbsp;2.1 style sheet must be written according to the <a
href="#detailed-grammar">grammar of CSS&nbsp;2.1</a>. Furthermore, it must
contain only at-rules, property names, and property values defined in this
specification. An <dfn id="illegal">illegal</dfn> (invalid) at-rule, property
name, or property value is one that is not valid.

<dt><dfn id="source">Source document</dfn>

<dd>The document to which one or more style sheets apply. This is encoded in
some language that represents the document as a tree of <a
href="#element">elements</a>. Each element consists of a name that identifies
the type of element, optionally a number of <a
href="#attribute">attributes</a>, and a (possibly empty) <a
href="#content">content</a>.

<dt><dfn id="document">Document language</dfn>

<dd>The encoding language of the source document (e.g., HTML, XHTML or SVG).
CSS is used to describe the presentation of document languages and CSS does
not change the underlying semantics of the document languages.

<dt><dfn id="element">Element</dfn>

<dd>(An SGML term, see <a href="#ISO8879" rel="biblioentry">[ISO8879]</a>.)
The primary syntactic constructs of the document language. Most CSS style
sheet rules use the names of these elements (such as P, TABLE, and OL in
HTML) to specify how the elements should be rendered.

<dt><dfn id="replaced">Replaced element</dfn>

<dd>An element for which the CSS formatter knows only the intrinsic
dimensions. In HTML, IMG and OBJECT elements can be replaced elements. For
example, the content of the IMG element is often replaced by the image that
the "src" attribute designates.

<dt><dfn id="intrinsic">Intrinsic dimensions</dfn>

<dd>The width and height as defined by the element itself, not imposed by the
surroundings. CSS does not define how the intrinsic dimensions are found. In
CSS&nbsp;2.1 it is assumed that all replaced elements, and only replaced
elements, come with intrinsic dimensions.

<dt><dfn id="attribute">Attribute</dfn>

<dd>A value associated with an element, consisting of a name, and an
associated (textual) value.

<dt><dfn id="content">Content</dfn>

<dd>The content associated with an element in the source document. Some
elements have no content, in which case they are called <dfn
id="empty">empty</dfn>. The content of an element may include text, and it
may include a number of sub-elements, in which case the element is called the
<dfn id="parent">parent</dfn> of those sub-elements.

<dt><dfn id="ignore0">Ignore</dfn>

<dd>This term has three slightly different meanings in this specification.
First, a CSS parser must follow certain rules when it discovers unknown or
illegal syntax in a style sheet. The parser must then ignore certain parts of
the style sheets. The exact rules for what parts must be ignored is given in
these section: <a href="#declaration">Declarations and properties</a>, <a
href="#error-handling">Rules for handling parsing errors</a>, <a
href="#unsupportedvalues">Unsupported Values</a>, or may be explained in the
text where the term "ignore" appears. Second, a user agent may (and, in some
cases must) disregard certain properties or values in the style sheet even if
the syntax is legal. For example, table-column-group elements cannot have
borders around them, so the border properties must be ignored.

<dt><dfn id="rendered">Rendered content</dfn>

<dd>The content of an element after the rendering that applies to it
according to the relevant style sheets has been applied. The rendered content
of a <span><a href="#replaced">replaced element</a></span> comes from outside
the source document. Rendered content may also be alternate text for an
element (e.g., the value of the XHTML "alt" attribute), and may include items
inserted implicitly or explicitly by the style sheet, such as bullets,
numbering, etc.

<dt><dfn id="document0">Document tree</dfn>

<dd>The tree of elements encoded in the source document. Each element in this
tree has exactly one parent, with the exception of the <dfn
id="root">root</dfn> element, which has none.

<dt><dfn id="child">Child</dfn>

<dd>An element A is called the child of element B if and only if B is the
parent of A.

<dt><dfn id="descendant">Descendant</dfn>

<dd>An element A is called a descendant of an element B, if either (1) A is a
child of B, or (2) A is the child of some element C that is a descendant of
B.

<dt><dfn id="ancestor">Ancestor</dfn>

<dd>An element A is called an ancestor of an element B, if and only if B is a
descendant of A.

<dt><dfn id="sibling">Sibling</dfn>

<dd>An element A is called a sibling of an element B, if and only if B and A
share the same parent element. Element A is a preceding sibling if it comes
before B in the document tree. Element B is a following sibling if it comes
after A in the document tree.

<dt><dfn id="preceding" title="preceding
element|element::preceding">Preceding element</dfn>

<dd>An element A is called a preceding element of an element B, if and only
if (1) A is an ancestor of B or (2) A is a preceding sibling of B.

<dt><dfn id="following" title="following
element|element::following">Following element</dfn>

<dd>An element A is called a following element of an element B, if and only
if B is a preceding element of A.

<dt><dfn id="author">Author</dfn>

<dd>An author is a person who writes documents and associated style sheets.
An <dfn id="authoring">authoring tool</dfn> generates documents and
associated style sheets.

<dt><dfn id="user">User</dfn>

<dd> A user is a person who interacts with a user agent to view, hear, or
otherwise use a document and its associated style sheet. The user may provide
a personal style sheet that encodes personal preferences.

<dt><dfn id="user-agent">User agent (UA)</dfn>

<dd>A <dfn id="user-" title="user agent|UA">user agent</dfn> is any program
that interprets a document written in the document language and applies
associated style sheets according to the terms of this specification. A user
agent may display a document, read it aloud, cause it to be printed, convert
it to another format, etc.

<dd>An HTML user agent is one that supports the HTML 2.x, HTML 3.x, or HTML
4.x specifications. A user agent that supports XHTML <a href="#XHTML10"
rel="biblioentry">[XHTML10]</a>, but not HTML (as listed in the previous
sentence) is not considered an HTML user agent for the purpose of conformance
with this specification.
</dl>

<h3 id="conf-UA"><span class="secno">9.2. </span>User agent conformance</h3>

<p class="issue">[This section should contain rules for user style sheet
conformance, author style sheet disabling, handling parsing errors, etc.,
from the CSS2.1 specification.]

<p class="issue">[Below is the text from CSS2.1. Much of it needs rewriting
given modularization. I've avoided substituting CSS3 where it's clearly not
going to be appropriate.]

<p>This section defines <dfn id="conformance">conformance</dfn> with the
CSS&nbsp;2.1 specification only. There may be other levels of CSS in the
future that may require a user agent to implement a different set of features
in order to conform.

<p>In general, the following points must be observed by a user agent claiming
conformance to this specification:

<ol>
<li>It must support one or more of the CSS3 <a href="#media-types">media
types</a>.

<li>For each source document, it must attempt to retrieve all associated
style sheets that are appropriate for the supported media types. If it cannot
retrieve all associated style sheets (for instance, because of network
errors), it must display the document using those it can retrieve.

<li>It must parse the style sheets according to this specification. In
particular, it must recognize all at-rules, blocks, declarations, and
selectors (see the <a href="#detailed-grammar">grammar of CSS&nbsp;2.1</a>).
If a user agent encounters a property that applies for a supported media
type, the user agent must parse the value according to the property
definition. This means that the user agent must accept all valid values and
must <span class="index" id="ignore9"><a href="#ignore">ignore</a></span>
declarations with invalid values. User agents must <span class="index"
id="ignore10"><a href="#ignore">ignore</a></span> rules that apply to
unsupported <a href="#media-types">media types</a>.
<!-- Define "accept"? Include statement that conforming user
agents may only allow one value for certain properties (for
backwards compatibility, see CSS1 for list of these properties),
i.e., the default style sheet value -IJ -->

<li>For each element in a <span><a href="#document0">document
tree</a></span>, it must assign a value for every applicable property
according to the property's definition and the rules of <a
href="http://www.w3.org/TR/REC-CSS2/cascade.html">cascading and
inheritance</a>.

<li>If the source document comes with alternate style sheet sets (such as
with the "alternate" keyword in HTML 4.0 <a href="#HTML40"
rel="biblioentry">[HTML40]</a>), the UA must allow the user to select which
style sheet set the UA should apply.
</ol>

<p>Not every user agent must observe every point, however:

<ul>
<li>An application that reads style sheets without rendering any content
(e.g., a CSS&nbsp;2.1 validator) must respect points 1-3.

<li>An authoring tool is only required to output <span title="valid style
sheet"><a href="#valid">valid style sheets</a></span>

<li>A user agent that <em>renders</em> a document with associated style
sheets must respect points 1-5 and render the document according to the
media-specific requirements set forth in this specification. <a
href="http://www.w3.org/TR/REC-CSS2/cascade.html#actual-value">Values</a> may
be approximated when required by the user agent.
</ul>

<p>The inability of a user agent to implement part of this specification due
to the limitations of a particular device (e.g., a user agent cannot render
colors on a monochrome monitor or page) does not imply non-conformance.

<p>UAs must allow users to specify a file that contains the user style sheet.
UAs that run on devices without any means of writing or specifying files are
exempted from this requirement. Additionally, UAs may offer other means to
specify user preferences, for example through a GUI.

<p>CSS2.1 does not define which properties apply to form controls and frames,
or how CSS can be used to style them. User agents may apply CSS properties to
these elements. Authors are recommended to treat such support as
experimental. A future level of CSS may specify this further.

<h4 id="error"><span class="secno">9.2.1. </span>Error conditions</h4>

<p>In general, this document does not specify error handling behavior for
user agents (e.g., how they behave when they cannot find a resource
designated by a URI).

<p>However, user agents must observe the <a href="#error-handling">rules for
handling parsing errors</a>.

<p>Since user agents may vary in how they handle error conditions, authors
and users must not rely on specific error recovery behavior.

<h3 id="conf-SS"><span class="secno">9.3. </span>Style sheet conformance</h3>

<h3 id="conf-AT"><span class="secno">9.4. </span>Authoring tool conformance</h3>

<p>Authoring tools may use a modified form of the <a
href="#error-handling">rules for handling parsing errors</a>: when those
rules require that user agents <em><a href="#ignore">ignore</a></em>
something, authoring tools are not required to ignore it. However, authoring
tools should not present such parts of the style sheet to the user in the
same way as valid parts of the style sheet. In so far as authoring tools
display the application of a style sheet to a document, they are required to
meet the <a href="#conf-UA">user agent conformance</a> rules.

<p class="issue">[informative reference to canonicalization proposal?]

<h2 id="property-defs"><span class="secno">10. </span>Format of property
definitions in other modules</h2>

<p>Each CSS property definition begins with a summary of key information that
resembles the following:

<div class="propdef">
<dl>
<dt><dfn class="propdef-title" id="property-name">'property-name'</dfn>

<dd>
<table cellpadding="0" cellspacing="0" class="propinfo">
<tbody>
<tr valign="baseline">
<td><em><a href="#values">Value:</a></em>&nbsp;&nbsp;

<td>legal values &amp; syntax

<tr valign="baseline">
<td><em>Initial:</em>&nbsp;&nbsp;

<td>initial value

<tr valign="baseline">
<td><em>Applies to:</em>&nbsp;&nbsp;

<td>elements this property applies to

<tr valign="baseline">
<td><em>Inherited:</em>&nbsp;&nbsp;

<td>whether the property is inherited

<tr valign="baseline">
<td><em>Computed Value:</em>&nbsp;&nbsp;

<td>the computed value of the property

<tr valign="baseline">
<td><em>Percentages:</em>&nbsp;&nbsp;

<td>how percentage values are interpreted

<tr valign="baseline">
<td><em><a href="#media0">Media:</a></em>&nbsp;&nbsp;

<td>which media groups the property applies to
</table>
</dl>
</div>

<h3 id="property-def-value"><span class="secno">10.1. </span>Value</h3>

<p>This part specifies the set of valid values for the property. Value types
may be designated in several ways:

<ol>
<li> keyword values (e.g., auto, disc, etc.)

<li> basic data types, which appear between "&lt;" and "&gt;" (e.g.,
&lt;length&gt;, &lt;percentage&gt;, etc.). In the electronic version of the
document, each instance of a basic data type links to its definition.

<li> types that have the same range of values as a property bearing the same
name (e.g., &lt;'border-width'&gt; &lt;'background-attachment'&gt;, etc.). In
this case, the type name is the property name (complete with quotes) between
"&lt;" and "&gt;" (e.g., &lt;'border-width'&gt;). Such a type does
<strong>not</strong> include the value 'inherit'. In the electronic version
of the document, each instance of this type of non-terminal links to the
corresponding property definition.

<li> non-terminals that do not share the same name as a property. In this
case, the non-terminal name appears between "&lt;" and "&gt;", as in
&lt;border-width&gt;. Notice the distinction between &lt;border-width&gt; and
&lt;'border-width'&gt;; the latter is defined in terms of the former. The
definition of a non-terminal is located near its first appearance in the
specification. In the electronic version of the document, each instance of
this type of value links to the corresponding value definition.
</ol>

<p>Other words in these definitions are keywords that must appear literally,
without quotes (e.g., red). The slash (/) and the comma (,) must also appear
literally.

<p>Values may be arranged as follows:

<ul>
<li>Several juxtaposed words mean that all of them must occur, in the given
order.

<li>A bar (|) separates two or more alternatives: exactly one of them must
occur.

<li>A double bar (||) separates two or more options: one or more of them must
occur, in any order.

<li>Brackets ([&nbsp;]) are for grouping.
</ul>

<p>Juxtaposition is stronger than the double bar, and the double bar is
stronger than the bar. Thus, the following lines are equivalent:

<pre>
    a b   |   c || d e
  [ a b ] | [ c || [ d e ]]
</pre>

<p> Every type, keyword, or bracketed group may be followed by one of the
following modifiers:

<ul>
<li> An asterisk (*) indicates that the preceding type, word, or group occurs
zero or more times.

<li> A plus (+) indicates that the preceding type, word, or group occurs one
or more times.

<li> A question mark (?) indicates that the preceding type, word, or group is
optional.

<li> A pair of numbers in curly braces ({A,B}) indicates that the preceding
type, word, or group occurs at least A and at most B times.
</ul>

<p>The following examples illustrate different value types:

<blockquote>
<p><em><a href="#values">Value:</a></em> N | NW | NE<br>
<em><a href="#values">Value:</a></em> [ &lt;length&gt; | thick | thin
]{1,4}<br>
<em><a href="#values">Value:</a></em> [&lt;family-name&gt; , ]*
&lt;family-name&gt;<br>
<em><a href="#values">Value:</a></em> &lt;uri&gt;? &lt;color&gt; [ /
&lt;color&gt; ]?<br>
<em><a href="#values">Value:</a></em> &lt;uri&gt; || &lt;color&gt;<br>
</blockquote>

<p>See the values and units <a href="#CSS3VAL"
rel="biblioentry">[CSS3VAL]</a> module for the formal definitions of the
basic values types.

<p class="issue">[We need a more formal grammar for parsing of properties.
Refer to section on keywords (they can't be quoted).]

<h4 id="initial"><span class="secno">10.1.1. </span><code>initial</code> and
<code>inherit</code> values</h4>

<p>In addition to the legal values stated, <code>initial</code> and
<code>inherit</code> values are also legal for every property. The meaning of
these values is described in the Values &amp; Units <a href="#CSS3VAL"
rel="biblioentry">[CSS3VAL]</a> and Cascading &amp; Inheritance <a
href="#CSS3CASCADE" rel="biblioentry">[CSS3CASCADE]</a> modules.

<h3 id="property-def-initial"><span class="secno">10.2. </span>Initial</h3>

<p>This part specifies the property's initial value. If the property is <a
href="#property-def-inherited">inherited</a>, this is the value that is given
to the root element of the <span><a href="#document0">document
tree</a></span>. Please consult the the Cascading &amp; Inheritance module <a
href="#CSS3CASCADE" rel="biblioentry">[CSS3CASCADE]</a> for information about
the interaction between style sheet-specified, inherited, and initial values.

<h3 id="property-def-applies"><span class="secno">10.3. </span>Applies to</h3>

<p>This part lists the elements to which the property applies. All elements
are considered to have all properties, but some properties have no rendering
effect on some types of elements. For example, <span
class="propinst-white-space">'white-space'</span> only affects block-level
elements.

<h3 id="property-def-inherited"><span class="secno">10.4. </span>Inherited</h3>

<p>This part indicates whether the value of the property is inherited from an
ancestor element by default ("Inherited: yes") or the value of the property
is its <a href="#property-def-initial">initial value</a> by default
("Inherited: no"). Please consult the Cascading &amp; Inheritance Module <a
href="#CSS3CASCADE" rel="biblioentry">[CSS3CASCADE]</a> for information about
the interaction between style sheet-specified, inherited, and initial values.

<h3 id="property-def-computed"><span class="secno">10.5. </span>Computed
value</h3>

<p>This part indicates the computed value of the property. The concept of
computed value is described in the Cascading &amp; Inheritance Module <a
href="#CSS3CASCADE" rel="biblioentry">[CSS3CASCADE]</a>. (It is needed both
for inheritance and for the definitions of some DOM properties.)

<p class="issue">[What is the computed value for elements to which the
property does not apply? Do some existing inherited properties rely on
inheritance through elements to which the property doesn't apply?]

<h3 id="property-def-percent"><span class="secno">10.6. </span>Percentage
values</h3>

<p>This part indicates how percentages should be interpreted, if they occur
in the value of the property. If "N/A" appears here, it means that the
property does not accept percentages as values.

<h3 id="media-groups"><span class="secno">10.7. </span>Media groups</h3>

<p class="issue">[Some of this needs to be relaxed to deal with profiles.]

<p><em>This section is informative, not normative.</em>

<p>This part indicates the media groups 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. User agents must
support the property if they support rendering to the media types included in
these media groups. Each property applies to all media types in the media
groups listed in its definition.

<p>CSS3 defines the following media groups:

<ul>
<li> <dfn id="continuous" title="'continuous' media group">continuous</dfn>
or <dfn id="paged" title="'paged' media group">paged</dfn>.

<li><dfn id="visual" title="'visual' media group">visual,</dfn> <dfn
id="audio" title="'audio' media group">audio,</dfn> <dfn id="speech"
title="'speech' media group">speech,</dfn> or <dfn id="tactile"
title="'tactile' media group">tactile</dfn>.

<li><dfn id="grid" title="'grid' media group">grid</dfn> (for character grid
devices), or <dfn id="bitmap" title="'bitmap' media group">bitmap</dfn>.

<li><dfn id="interactive" title="'interactive' media group">interactive</dfn>
(for devices that allow user interaction), or <dfn id="static"
title="'static' media group">static</dfn> (for those that don't).

<li><dfn id="all" title="'all' media group">all</dfn> (includes all media
types)
</ul>

<p>The following table shows the relationships between media groups and media
types:

<table border summary="Relationship between media groups and media types">
<caption>Relationship between media groups and media types</caption>

<tbody>
<tr>
<th>Media Types

<th colspan="4">Media Groups

<tr>
<th>&nbsp;

<th>continuous/paged

<th>visual/audio/speech/tactile

<th>grid/bitmap

<th>interactive/static <!--
<TR><TH>audio<TD align="center">continuous<TD align="center">audio<TD align="center">N/A<TD align="center">both</TR>
-->

<tr>
<th>braille

<td align="center">continuous

<td align="center">tactile

<td align="center">grid

<td align="center">both

<tr>
<th>emboss

<td align="center">paged

<td align="center">tactile

<td align="center">grid

<td align="center">static

<tr>
<th>handheld

<td align="center">both

<td align="center">visual, audio, speech

<td align="center">both

<td align="center">both

<tr>
<th>print

<td align="center">paged

<td align="center">visual

<td align="center">bitmap

<td align="center">static

<tr>
<th>projection

<td align="center">paged

<td align="center">visual

<td align="center">bitmap

<td align="center">interactive

<tr>
<th>screen

<td align="center">continuous

<td align="center">visual, audio

<td align="center">bitmap

<td align="center">both

<tr>
<th>speech

<td align="center">continuous

<td align="center">speech

<td align="center">N/A

<td align="center">both

<tr>
<th>tty

<td align="center">continuous

<td align="center">visual

<td align="center">grid

<td align="center">both

<tr>
<th>tv

<td align="center">both

<td align="center">visual, audio

<td align="center">bitmap

<td align="center">both
</table>

<h3 id="shorthand"><span class="secno">10.8. </span>Shorthand properties</h3>

<p>Some properties are <dfn id="shorthand0" title="shorthand
property">shorthand properties</dfn>, meaning they allow authors to specify
the values of several properties with a single property.

<p>For instance, the <span class="propinst-font">'font'</span> property is a
shorthand property for setting <span
class="propinst-font-style">'font-style'</span>, <span
class="propinst-font-variant">'font-variant'</span>, <span
class="propinst-font-weight">'font-weight'</span>, <span
class="propinst-font-size">'font-size'</span>, <span
class="propinst-line-height">'line-height'</span>, and <span
class="propinst-font-family">'font-family'</span> all at once.

<p>The syntax of a shorthand property may allow some of the properties that
can be specified by that shorthand to be omitted. When such values are
omitted from a shorthand form, each "missing" property is assigned its
initial value (see the Cascading &amp; Inheritance module <a
href="#CSS3CASCADE" rel="biblioentry">[CSS3CASCADE]</a>). The definition of a
shorthand property may further say that it resets the definitions of other
properties to their initial value.

<div class="example">
<p> The multiple style rules of this example:

<pre>
h1 {
  font-weight: bold;
  font-size: 2em;
  line-height: 1.2;
  font-family: Helvetica, Arial, sans-serif;
  font-variant: normal;
  font-style: normal;
  font-stretch: normal;
  font-size-adjust: none
}
</pre>

<p>may be rewritten with a single shorthand property:

<pre>
h1 { font: bold 2em/1.2 Helvetica, Arial, sans-serif }
</pre>

<p>In this example, <span
class="propinst-font-variant">'font-variant'</span>, <span
class="propinst-font-stretch">'font-stretch'</span>, <span
class="propinst-font-size-adjust">'font-size-adjust'</span>, and <span
class="propinst-font-style">'font-style'</span> take their initial values.
</div>

<h2 id="detailed-grammar"><span class="secno">11. </span>Appendix: Second
grammar</h2>

<p class="issue">[This grammar was the Appendix D grammar of CSS2, augmented
by the additions from the @namespace draft. It needs to be incorporated into
the above normative text in some way.]

<p>The grammar below defines the syntax of CSS2. It is in some sense,
however, a superset of CSS2 as this specification imposes additional semantic
constraints not expressed in this grammar. A conforming UA must also adhere
to the <a href="#syntax"> forward-compatible parsing rules</a>, the <a
href="#property-defs">property and value notation</a>, and the unit notation.
In addition, the document language may impose restrictions, e.g. HTML imposes
restrictions on the possible values of the "class" attribute.
<!-- IJ: There used to be a link to "unit notation", but I couldn't
find anything in the spec that corresponded. -->

<h3 id="grammar0"><span class="secno">11.1. </span>Grammar</h3>

<p>The grammar below is <span class="index" id="ll1"
title="LL(1)">LL(1)</span> (but note that most UA's should not use it
directly, since it doesn't express the forward-compatible <a
href="#syntax">parsing conventions</a>, only the CSS3 syntax). The format of
the productions is optimized for human consumption and some shorthand
notation beyond Yacc (see <a href="#YACC" rel="biblioentry">[YACC]</a>) is
used:

<p class="issue">[It's probably not LL(1), but rather just LALR(1).]

<p class="issue">[This needs a lot more revisions to reflect all the
additions in CSS3.]

<p class="issue">[This doesn't allow nested at-rules, such as
<code>@page</code> inside <code><a href="#media0">@media</a></code>. Do we
want to allow this?]

<ul>
<li><strong>*</strong>: 0 or more

<li><strong>+</strong>: 1 or more

<li><strong>?</strong>: 0 or 1

<li><strong>|</strong>: separates alternatives

<li><strong>[&nbsp;]</strong>: grouping
</ul>

<p>The productions are:

<pre>
stylesheet
  : [ CHARSET_SYM S* STRING S* ';' ]?
    [S|CDO|CDC]* [ import [S|CDO|CDC]* ]*
    [ namespace [S|CDO|CDC]* ]*
    [ [ ruleset | media | page | font_face ] [S|CDO|CDC]* ]*
  ;
import
  : IMPORT_SYM S*
    [STRING|URI] S* [ medium [ ',' S* medium]* ]? ';' S*
  ;
namespace
  : NAMESPACE_SYM S* [namespace_prefix S*]? [STRING|URI] S* ';' S*
  ;
namespace_prefix
  : IDENT
  ;
media
  : MEDIA_SYM S* medium [ ',' S* medium ]* '{' S* ruleset* '}' S*
  ;
medium
  : IDENT S*
  ;
page
  : PAGE_SYM S* IDENT? pseudo_page? S*
    '{' S* declaration [ ';' S* declaration ]* '}' S*
  ;
pseudo_page
  : ':' IDENT
  ;
font_face
  : FONT_FACE_SYM S*
    '{' S* declaration [ ';' S* declaration ]* '}' S*
  ;
operator
  : '/' S* | ',' S* | /* empty */
  ;
combinator
  : '+' S* | '>' S* | /* empty */
  ;
unary_operator
  : '-' | '+'
  ;
property
  : IDENT S*
  ;
ruleset
  : selector [ ',' S* selector ]*
    '{' S* declaration [ ';' S* declaration ]* '}' S*
  ;
<span class="index" id="selector0"><a href="#selector">selector</a></span>
  : simple_selector [ combinator simple_selector ]*
  ;
simple_selector
  : element_name? [ HASH | class | attrib | pseudo ]* S*
  ;
class
  : '.' IDENT
  ;
element_name
  : IDENT | '*'
  ;
attrib
  : '[' S* IDENT S* [ [ '=' | INCLUDES | DASHMATCH ] S*
    [ IDENT | STRING ] S* ]? ']'
  ;
pseudo
  : ':' [ IDENT | FUNCTION S* IDENT S* ')' ]
  ;
declaration
  : property ':' S* expr prio?
  | /* empty */
  ;
prio
  : IMPORTANT_SYM S*
  ;
expr
  : term [ operator term ]*
  ;
term
  : unary_operator?
    [ NUMBER S* | PERCENTAGE S* | LENGTH S* | EMS S* | EXS S* | ANGLE S* |
      TIME S* | FREQ S* | function ]
  | STRING S* | IDENT S* | URI S* | UNICODERANGE S* | hexcolor
  ;
function
  : FUNCTION S* expr ')' S*
  ;
/*
 * There is a constraint on the <span class="index" id="color">color</span> that it must
 * have either 3 or 6 hex-digits (i.e., [0-9a-fA-F])
 * after the "#"; e.g., "#000" is OK, but "#abcd" is not.
 */
hexcolor
  : HASH S*
  ;
</pre>

<h3 id="lexical"><span class="secno">11.2. </span>Lexical scanner</h3>

<p> The following is the <dfn id="tokenizer">tokenizer</dfn>, written in Flex
(see <a href="#FLEX" rel="biblioentry">[FLEX]</a>) notation. The tokenizer is
case-insensitive.

<p>The two occurrences of "\377" represent the highest character number that
current versions of Flex can deal with (decimal 255). They should be read as
"\4177777" (decimal 1114111), which is the highest possible code point in
<span class="index" id="unicode">Unicode</span>/<span class="index"
id="iso-10646">ISO-10646</span>, except excluding the characters excluded in
the <code><a href="#SUBTOK-nonascii">nonascii</a></code> production above.
<!-- ignored whitespace after Unicode escape, is it OK? -->

<pre>
%option case-insensitive

h		[0-9a-f]
nonascii	[\200-\377]
unicode		\\{h}{1,6}[ \t\r\n\f]?
escape		{unicode}|\\[ -~\200-\377]
nmstart		[a-z]|{nonascii}|{escape}
nmchar		[a-z0-9-]|{nonascii}|{escape}
string1		\"([\t !#$%&amp;(-~]|\\{nl}|\'|{nonascii}|{escape})*\"
string2		\'([\t !#$%&amp;(-~]|\\{nl}|\"|{nonascii}|{escape})*\'

ident		[-]?{nmstart}{nmchar}*
name		{nmchar}+
num		[0-9]+|[0-9]*"."[0-9]+
string		{string1}|{string2}
url		([!#$%&amp;*-~]|{nonascii}|{escape})*
w		[ \t\r\n\f]*
nl		\n|\r\n|\r|\f
range		\?{1,6}|{h}(\?{0,5}|{h}(\?{0,4}|{h}(\?{0,3}|{h}(\?{0,2}|{h}(\??|{h})))))

%%

[ \t\r\n\f]+		{return S;}

\/\*[^*]*\*+([^/][^*]*\*+)*\/	/* ignore comments */

"&lt;!--"			{return CDO;}
"-->"			{return CDC;}
"~="			{return INCLUDES;}
"|="			{return DASHMATCH;}

{string}		{return STRING;}

{ident}			{return IDENT;}

"#"{name}		{return HASH;}

"@import"		{return IMPORT_SYM;}
"@page"			{return PAGE_SYM;}
"@media"		{return MEDIA_SYM;}
"@font-face"		{return FONT_FACE_SYM;}
"@charset"		{return CHARSET_SYM;}
"@namespace"		{return NAMESPACE_SYM;}

"!{w}important"		{return IMPORTANT_SYM;}

{num}em			{return EMS;}
{num}ex			{return EXS;}
{num}px			{return LENGTH;}
{num}cm			{return LENGTH;}
{num}mm			{return LENGTH;}
{num}in			{return LENGTH;}
{num}pt			{return LENGTH;}
{num}pc			{return LENGTH;}
{num}deg		{return ANGLE;}
{num}rad		{return ANGLE;}
{num}grad		{return ANGLE;}
{num}ms			{return TIME;}
{num}s			{return TIME;}
{num}Hz			{return FREQ;}
{num}kHz		{return FREQ;}
{num}{ident}		{return DIMEN;}
{num}%			{return PERCENTAGE;}
{num}			{return NUMBER;}

"url("{w}{string}{w}")"	{return URI;}
"url("{w}{url}{w}")"	{return URI;}
{ident}"("		{return FUNCTION;}

U\+{range}		{return UNICODERANGE;}
U\+{h}{1,6}-{h}{1,6}	{return UNICODERANGE;}

.			{return *yytext;}
</pre>

<h2 class="no-num" id="changes">Changes from CSS2</h2>

<p>This section is informative.

<p> The parts of CSS2 that have become part of this CSS3 draft are sections
1.3.2 (1.4.2 in CSS 2.1), 1.3.3 (1.4.3 in CSS2.1), 3 (parts), 4.1, 4.2, 4.4,
and 6.3, 7, and Appendix D. This draft also contains new material on
namespaces and on vendor extensions to CSS that began as separate documents.

<ul>
<li>The text taken from Chapter 1 of CSS2 is now normative rather than
informative.

<li>added the section on vendor extensions and added the <span
class="css">'-'</span> character to the ident productions so that identifiers
can begin with it

<li>modified the rules for handling parsing errors to allow implementations
that support only parts of CSS3

<li>described how style sheets that cannot be parsed according to the grammar
should be handled (by saying that parsing uses the parseable initial sequence
of tokens)

<li><span class="issue">[to be done]</span> described handling of unmatched
quotation marks (by saying that tokenization uses the tokenizable initial
sequence of characters)

<li><span class="issue">[to be done]</span> formalized the error handling
rules by combining the forward-compatible grammar in chapter 4 with the CSS2
grammar in Appendix D.

<li>combined DELIM and other single character tokens into CHAR

<li>explicitly stated that the byte order mark should be ignored for purposes
of the grammar

<li>Changed the acceptable characters to exclude surrogate blocks and #xFFFE,
#xFFFF, as in XML.

<li>Changed the rules on what to do when a character encoding is not
specified.
</ul>

<h2 class="no-num" id="acknowledgments">Acknowledgments</h2>

<p>Since most of this draft is taken from CSS2, it would not have been
possible to write it so easily without the work of the editors and authors of
<a href="#CSS1" rel="biblioentry">[CSS1]</a> and <a href="#CSS2"
rel="biblioentry">[CSS2]</a>. This draft also borrows heavily from earlier
drafts on CSS namespace support by Peter Linss <a href="#CSS3NAMESPACE"
rel="biblioentry">[CSS3NAMESPACE]</a> and early (unpublished) drafts on
vendor extensions to CSS by Bert Bos. Many current and former members of the
working group have contributed to this document. Discussions on <code><a
href="http://lists.w3.org/Archives/Public/www-style/">www-style@w3.org</a></code>
and in other places have also contributed ideas to this specification.
Comments from Glenn Adams, Bj&ouml;rn H&ouml;hrmann, and Etan Wexler have
been particularly helpful.

<h2 class="no-num" id="references">References</h2>

<h3 class="no-num" id="normative">Normative references</h3>
<!-- begin-normative -->
<!-- Sorted by label -->

<dl class="bibliography">
<dt style="display: none"><!-- keeps the doc valid if the DL is empty -->
<!---->

<dt id="CSS3CASCADE">[CSS3CASCADE]

<dd>Håkon Wium Lie. <cite>CSS3 module: Cascading and inheritance.</cite> 13
July 2001. W3C Working Draft. (Work in progress.) URL: <a
href="http://www.w3.org/TR/2001/WD-css3-cascade-20010713">http://www.w3.org/TR/2001/WD-css3-cascade-20010713</a>
<!---->

<dt id="CSS3VAL">[CSS3VAL]

<dd>Håkon Wium Lie. <cite>CSS3 module: values and units.</cite>
(forthcoming). W3C working draft. (Work in progress.)
<!---->

<dt id="HTML40">[HTML40]

<dd>Raggett, D.; Le Hors, A.; Jacobs, I.. <cite>HTML 4.0 Specification
(revised).</cite> Apr 1998. W3C Recommendation. URL: <a
href="http://www.w3.org/TR/1998/REC-html40-19980424">http://www.w3.org/TR/1998/REC-html40-19980424</a>
<!---->

<dt id="HTTP11">[HTTP11]

<dd>Fielding, Roy,; et al. <cite>Hypertext Transfer Protocol -
HTTP/1.1.</cite> June 1999. Internet RFC 2616. URL: <a
href="ftp://ftp.isi.edu/in-notes/rfc2616.txt">ftp://ftp.isi.edu/in-notes/rfc2616.txt</a>
<!---->

<dt id="ISO10646">[ISO10646]

<dd><cite>Information Technology - Universal Multiple- Octet Coded
CharacterSet (UCS) - Part 1: Architecture and Basic Multilingual
Plane.</cite> ISO/IEC10646-1:1993. The current specification also takes into
consideration the first five amendments to ISO/IEC 10646-1:1993. Useful &lt;a
href=&quot;http://www.egt.ie/standards/iso10646/ucs-roadmap.html&quot;&gt;roadmaps&lt;/a&gt;show
which scripts sit at which numeric ranges.
<!---->

<dt id="ISO8879">[ISO8879]

<dd><cite>Information Processing -- Text and Office Systems -- Standard
Generalized Markup Language (SGML).</cite> ISO 8879:1986.. URL: <a
href="http://www.iso.ch/cate/d16387.html">http://www.iso.ch/cate/d16387.html</a>
<!---->

<dt id="RFC2045">[RFC2045]

<dd>N. Freed and N. Borenstein. <cite>Multipurpose Internet Mail Extensions
(MIME) Part One: Format of Internet Message Bodies.</cite> November 1996.
URL: <a
href="http://www.ietf.org/rfc/rfc2045.txt">http://www.ietf.org/rfc/rfc2045.txt</a>
<!---->

<dt id="RFC2119">[RFC2119]

<dd>S. Bradner. <cite>Key words for use in RFCs to Indicate Requirement
Levels.</cite> Internet RFC 2119. URL: <a
href="http://www.ietf.org/rfc/rfc2119.txt">http://www.ietf.org/rfc/rfc2119.txt</a>
<!---->

<dt id="RFC2318">[RFC2318]

<dd>H. Lie, B. Bos, C. Lilley. <cite>The text/css Media Type.</cite> March
1998.. URL: <a
href="http://www.ietf.org/rfc/rfc2318.txt">http://www.ietf.org/rfc/rfc2318.txt</a>
<!---->

<dt id="RFC2978">[RFC2978]

<dd>N. Freed; J. Postel. <cite>IANA Charset Registration Procedures.</cite>
October 2000. Internet RFC 2978. URL: <a
href="http://www.ietf.org/rfc/rfc2978.txt">http://www.ietf.org/rfc/rfc2978.txt</a>
<!---->

<dt id="SELECT">[SELECT]

<dd>Daniel Glazman; Tantek Çelik; Ian Hickson; et al. <cite>Selectors.</cite>
13 Nov 2001. W3C Candidate Recommendation. URL: <a
href="http://www.w3.org/TR/2001/CR-css3-selectors-20011113">http://www.w3.org/TR/2001/CR-css3-selectors-20011113</a>
<!---->

<dt id="UNICODE310">[UNICODE310]

<dd>The Unicode Consortium. <cite>The Unicode Standard: Version 3.1.0.</cite>
Addison Wesley Longman. 2000. ISBN 0-201-61633-5. For more information,
consult the Unicode Consortium's home page at &lt;a
href=&quot;http://www.unicode.org/&quot;&gt;http://www.unicode.org/&lt;/a&gt;
URL: <a
href="http://www.unicode.org/unicode/standard/versions/enumeratedversions.html#Unicode_3_1_0">http://www.unicode.org/unicode/standard/versions/enumeratedversions.html#Unicode_3_1_0</a>
<!---->
</dl>
<!-- end-normative -->

<h3 class="no-num" id="other">Other references</h3>
<!-- begin-informative -->
<!-- Sorted by label -->

<dl class="bibliography">
<dt style="display: none"><!-- keeps the doc valid if the DL is empty -->
<!---->

<dt id="CHARSETS">[CHARSETS]

<dd><cite>Characters sets.</cite> These are the official names for character
sets that may be used in the Internet and may be referred to in Internet
documentation URL: <a
href="http://www.iana.org/assignments/character-sets">http://www.iana.org/assignments/character-sets</a>
<!---->

<dt id="CSS1">[CSS1]

<dd>Håkon Wium Lie; Bert Bos. <cite>Cascading Style Sheets, level 1.</cite>
1996. W3C Recommendation. Revised 11 Jan 1999. URL: <a
href="http://www.w3.org/TR/REC-CSS1">http://www.w3.org/TR/REC-CSS1</a>
<!---->

<dt id="CSS2">[CSS2]

<dd>Bert Bos; Håkon Wium Lie; Chris Lilley; Ian Jacobs. <cite>Cascading Style
Sheets, level 2.</cite> 1998. W3C Recommendation. URL: <a
href="http://www.w3.org/TR/REC-CSS2">http://www.w3.org/TR/REC-CSS2</a>
<!---->

<dt id="CSS3GENCON">[CSS3GENCON]

<dd>Håkon Wium Lie; Ian Hickson. <cite>CSS3 module: generated text.</cite>
(forthcoming). W3C working draft. (Work in progress.)
<!---->

<dt id="CSS3NAMESPACE">[CSS3NAMESPACE]

<dd>Peter Linss. <cite>CSS Namespace Enhancements.</cite> 25 June 1999. W3C
working draft. (Proposal) URL: <a
href="http://www.w3.org/1999/06/25/WD-css3-namespace-19990625/">http://www.w3.org/1999/06/25/WD-css3-namespace-19990625/</a>
<!---->

<dt id="CSS3PAGE">[CSS3PAGE]

<dd>Robert Stevahn. <cite>CSS3 module: paged media.</cite> 28 Sep 1999. W3C
working draft. (Work in progress) URL: <a
href="http://www.w3.org/TR/1999/WD-css3-page-19990928">http://www.w3.org/TR/1999/WD-css3-page-19990928</a>
<!---->

<dt id="CSS3SPEECH">[CSS3SPEECH]

<dd>Dave Raggett; Daniel Glazman. <cite>CSS3 Speech Module.</cite> 14 May
2003. W3C working draft. (Work in progress.) URL: <a
href="http://www.w3.org/TR/2003/WD-css3-speech-20030514">http://www.w3.org/TR/2003/WD-css3-speech-20030514</a>
<!---->

<dt id="CSSSTYLEATTR">[CSSSTYLEATTR]

<dd>Tantek Çelik; Bert Bos; Marc Attinasi. <cite>Syntax of CSS rules in
HTML's &quot;style&quot; attribute.</cite> 15 May 2002. W3C working draft.
(Work in progress.) URL: <a
href="http://www.w3.org/TR/2002/WD-css-style-attr-20020515">http://www.w3.org/TR/2002/WD-css-style-attr-20020515</a>
<!---->

<dt id="FLEX">[FLEX]

<dd><cite>Flex: The Lexical Scanner Generator.</cite> Version 2.3.7, ISBN
1882114213
<!---->

<dt id="MEDIAQ">[MEDIAQ]

<dd>Håkon Wium Lie; Tantek Çelik; Daniel Glazman. <cite>Media queries.</cite>
23 January 2002. W3C Working Draft. (Work in progress.) URL: <a
href="http://www.w3.org/TR/2002/CR-css3-mediaqueries-20020708">http://www.w3.org/TR/2002/CR-css3-mediaqueries-20020708</a>
<!---->

<dt id="XHTML10">[XHTML10]

<dd>Steven Pemberton; et al. <cite>XHTML 1.0: The Extensible HyperText Markup
Language.</cite> Jan 2000. W3C Recommendation. URL: <a
href="http://www.w3.org/TR/2000/REC-xhtml1-20000126">http://www.w3.org/TR/2000/REC-xhtml1-20000126</a>
<!---->

<dt id="XML10">[XML10]

<dd>Tim Bray; Jean Paoli; C. M. Sperberg-McQueen; Eve Maler. <cite>Extensible
Markup Language (XML) 1.0 (Second Edition).</cite> Oct 2000. W3C
Recommendation. URL: <a
href="http://www.w3.org/TR/2000/REC-xml-20001006">http://www.w3.org/TR/2000/REC-xml-20001006</a>
<!---->

<dt id="XMLSTYLE">[XMLSTYLE]

<dd>J. Clark. <cite>Associating Style Sheets with XML documents.</cite> 29
June 1999. W3C Recommendation. URL: <a
href="http://www.w3.org/TR/xml-stylesheet">http://www.w3.org/TR/xml-stylesheet</a>
<!---->

<dt id="YACC">[YACC]

<dd>S. C. Johnson. <cite>YACC - Yet another compiler compiler.</cite> Murray
Hill. 1975. Technical Report.
<!---->
</dl>
<!-- end-informative -->

<h2 class="no-num" id="index">Index</h2>
<!--begin-index-->

<ul class="indexlist">
<li>'all' media group, <a href="#all"><strong>#</strong></a>

<li>Ancestor, <a href="#ancestor"><strong>#</strong></a>

<li>at-keyword, <a href="#at-keyword"><strong>#</strong></a>

<li>At-rules, <a href="#at-rules0"><strong>#</strong></a>, <a
href="#at-rules1"><strong>#</strong></a>, <a href="#at-rules2">#</a>

<li>Attribute, <a href="#attribute"><strong>#</strong></a>

<li>'audio' media group, <a href="#audio"><strong>#</strong></a>

<li>Author, <a href="#author"><strong>#</strong></a>

<li>authoring tool, <a href="#authoring"><strong>#</strong></a>

<li>backslash escapes, <a href="#character"><strong>#</strong></a>

<li>'bitmap' media group, <a href="#bitmap"><strong>#</strong></a>

<li>block, <a href="#block">#</a>

<li>Blocks, <a href="#blocks0"><strong>#</strong></a>, <a
href="#blocks1"><strong>#</strong></a>

<li>byte order mark (BOM), <a href="#BOM">#</a>

<li>case sensitivity, <a href="#case-insensitive">#</a>

<li>character encoding, <a href="#encoded"><strong>#</strong></a>
<ul>
<li>default, <a href="#character0">#</a>

<li>user agent's determination of, <a href="#priorities">#</a>
</ul>

<li>@charset, <a href="#charset"><strong>#</strong></a>, <a
href="#charset0">#</a>

<li>Child, <a href="#child"><strong>#</strong></a>

<li>color, <a href="#color">#</a>

<li>COMMENT, <a href="#comment"><strong>#</strong></a>

<li>Comments, <a href="#comments0"><strong>#</strong></a>, <a
href="#comments1"><strong>#</strong></a>

<li>Comments , <a href="#comments2">#</a>

<li>conditional import, <a href="#conditional"><strong>#</strong></a>

<li>conformance, <a href="#conformance"><strong>#</strong></a>

<li>Content, <a href="#content"><strong>#</strong></a>

<li>'continuous' media group, <a href="#continuous"><strong>#</strong></a>

<li>declaration, <a href="#declaration"><strong>#</strong></a>

<li>declaration-block, <a href="#declaration-block"><strong>#</strong></a>

<li>default
<ul>
<li>character encoding, <a href="#character0">#</a>
</ul>

<li>Descendant, <a href="#descendant"><strong>#</strong></a>

<li>Document language, <a href="#document"><strong>#</strong></a>

<li>Document tree, <a href="#document0"><strong>#</strong></a>

<li>Element, <a href="#element"><strong>#</strong></a>
<ul>
<li>following, <a href="#following"><strong>#</strong></a>

<li>preceding, <a href="#preceding"><strong>#</strong></a>
</ul>

<li>empty, <a href="#empty"><strong>#</strong></a>

<li>error handling points, <a href="#error0"><strong>#</strong></a>

<li>following element, <a href="#following"><strong>#</strong></a>

<li>forward-compatible parsing, <a
href="#forward-compatible"><strong>#</strong></a>

<li>'grid' media group, <a href="#grid"><strong>#</strong></a>

<li>identifier, <a href="#identifiers"><strong>#</strong></a>

<li>ignore, <a href="#ignore"><strong>#</strong></a>, <a
href="#ignore0"><strong>#</strong></a>, <a href="#ignore1">#</a>, <a
href="#ignore10">#</a>, <a href="#ignore2">#</a>, <a href="#ignore3">#</a>,
<a href="#ignore4">#</a>, <a href="#ignore5">#</a>, <a href="#ignore6">#</a>,
<a href="#ignore7">#</a>, <a href="#ignore8">#</a>, <a href="#ignore9">#</a>,
<a href="#ignored">#</a>, <a href="#ignored.">#</a>, <a
href="#ignores">#</a>, <a href="#ignores0">#</a>

<li>illegal, <a href="#illegal"><strong>#</strong></a>

<li>'@import', <a href="#import"><strong>#</strong></a>

<li>@import, <a href="#import0">#</a>, <a href="#import1">#</a>

<li>'interactive' media group, <a href="#interactive"><strong>#</strong></a>

<li>Intrinsic dimensions, <a href="#intrinsic"><strong>#</strong></a>

<li>ISO-10646, <a href="#iso-10646">#</a>

<li>LL(1), <a href="#ll1">#</a>

<li>"MAY", <a href="#may"><strong>#</strong></a>

<li>@media, <a href="#media0"><strong>#</strong></a>, <a href="#media2">#</a>

<li>media-dependent import, <a href="#conditional"><strong>#</strong></a>

<li>media type, <a href="#media1"><strong>#</strong></a>

<li>message entity, <a href="#message"><strong>#</strong></a>

<li>"MUST", <a href="#must"><strong>#</strong></a>

<li>"MUST NOT", <a href="#must-not"><strong>#</strong></a>

<li>"OPTIONAL", <a href="#optional"><strong>#</strong></a>

<li>'paged' media group, <a href="#paged"><strong>#</strong></a>

<li>parent, <a href="#parent"><strong>#</strong></a>

<li>preceding element, <a href="#preceding"><strong>#</strong></a>

<li>property, <a href="#property"><strong>#</strong></a>

<li>'property-name', <a href="#property-name"><strong>#</strong></a>

<li>"RECOMMENDED", <a href="#recommended"><strong>#</strong></a>

<li>Rendered content, <a href="#rendered"><strong>#</strong></a>

<li>Replaced element, <a href="#replaced"><strong>#</strong></a>

<li>"REQUIRED", <a href="#required"><strong>#</strong></a>

<li>root, <a href="#root"><strong>#</strong></a>

<li>rule sets, <a href="#rule-">#</a>

<li>selector, <a href="#selector"><strong>#</strong></a>, <a
href="#selector0">#</a>

<li>"SHALL", <a href="#shall"><strong>#</strong></a>

<li>"SHALL NOT", <a href="#shall0"><strong>#</strong></a>

<li>shorthand property, <a href="#shorthand0"><strong>#</strong></a>

<li>"SHOULD", <a href="#should"><strong>#</strong></a>

<li>"SHOULD NOT", <a href="#should0"><strong>#</strong></a>

<li>Sibling, <a href="#sibling"><strong>#</strong></a>

<li>Source document, <a href="#source"><strong>#</strong></a>

<li>'speech' media group, <a href="#speech"><strong>#</strong></a>

<li>statements, <a href="#statements0">#</a>

<li>'static' media group, <a href="#static"><strong>#</strong></a>

<li>string, <a href="#string">#</a>

<li>Style sheet, <a href="#style0"><strong>#</strong></a>

<li>'tactile' media group, <a href="#tactile"><strong>#</strong></a>

<li>text/css, <a href="#textcss"><strong>#</strong></a>, <a
href="#textcss0"><strong>#</strong></a>

<li>tokenizer, <a href="#tokenizer"><strong>#</strong></a>

<li>UA, <a href="#user-"><strong>#</strong></a>

<li>Unicode, <a href="#unicode">#</a>

<li>User, <a href="#user"><strong>#</strong></a>

<li>user agent, <a href="#user-"><strong>#</strong></a>

<li>User agent (UA), <a href="#user-agent"><strong>#</strong></a>

<li>Valid style sheet, <a href="#valid"><strong>#</strong></a>

<li>value, <a href="#values"><strong>#</strong></a>

<li>'visual' media group, <a href="#visual"><strong>#</strong></a>

<li>whitespace, <a href="#whitespace"><strong>#</strong></a>
</ul>
<!--end-index-->
<!-- Keep this comment at the end of the file
Local variables:
mode: sgml
sgml-declaration:"~/SGML/HTML4.decl"
sgml-default-doctype-name:"html"
sgml-minimize-attributes:t
sgml-nofill-elements:("pre" "style" "br")
sgml-live-element-indicator:t
End:
-->