csswg-drafts/css2/about.html at ff3c388aba9bf47d6443931053203b62becb26d7 · w3c/csswg-drafts · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355
356
357
358
359
360
361
362
363
364
365
366
367
368
369
370
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html lang="en">

<HEAD>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<TITLE>About the CSS2 Specification</TITLE>
<LINK rel="next" href="intro.html">
<LINK rel="previous" href="cover.html">
<LINK rel="STYLESHEET" href="style/default.css" type="text/css">
</HEAD>
<BODY>
<div class="navbar">
<center>&nbsp;<a href="cover.html">previous</a> &nbsp; <a href="intro.html">next</a> &nbsp; <a href="cover.html#toc">contents</a> &nbsp; <a href="indexlist.html">index</a>
</center><hr>
</div>

<H1 align="center">About the CSS2 Specification</H1>

<h2><a name="h-1.1">1.1</a> Reading the specification</h2>

<P>This specification has been written with two types of readers in
mind: CSS authors and CSS implementors. We hope the specification will
provide authors with the tools they need to write efficient,
attractive, and accessible documents, without overexposing them to
CSS's implementation details. Implementors, however, should find all
they need to build <a href="convent.html#conformance">conforming user
agents</a>.

The specification begins with a general presentation of CSS and
becomes more and more technical and specific towards the end. For
quick access to information, a general table of contents,
specific tables of contents at the beginning of each section,
and an index provide easy navigation, in both the electronic
and printed versions.

<P>The specification has been written with two modes of presentation
in mind: electronic and printed. Although the two presentations will
no doubt be similar, readers will find some differences. For example,
links will not work in the printed version (obviously), and page
numbers will not appear in the electronic version. In case of a
discrepancy, the electronic version is considered the authoritative
version of the document.

<h2><a name="h-1.2">1.2</a> How the specification is organized</h2>

<P>The specification is organized into the following sections:

<dl>

<dt><Strong>Section 2: An introduction CSS2</strong>

<dd>The introduction includes a brief tutorial in CSS2 and
a discussion of design principles behind CSS2.

<dt><strong>Sections 3 - 19: CSS2 reference manual.</strong>

<dd>The bulk of the reference manual consists of the CSS2 language
reference. This reference defines what may go into a CSS2 style sheet
(syntax, properties, property values) and how user agents must
interpret these style sheets in order to claim <a
href="convent.html#conformance">conformance</a>.


<dt><strong>Appendixes:</strong>

<dd>Five appendixes contain information about <a href="sample.html">a
sample style sheet for HTML 4.0</a>, <a href="changes.html">changes
from CSS1 </a>, <a href="notes.html">implementation and
performance notes</a>, <a href="grammar.html">the grammar of CSS2</a>, and
some helpful notes on implementing <a href="fonts.html">WebFonts</a>.

<dt><strong>References:</strong>

<dd>A list of normative and informative references.

<dt><strong>General index:</strong>

<dd>The <a href="indexlist.html">general index</a> contains links to key
concepts, property and value definitions, and other useful
information.

</dl>

<H2><a name="h-1.3">1.3</a> Conventions</H2>

<H3><a name="h-1.3.1">1.3.1</a> <a href="convent.html#doclanguage">Document language</a> elements
and attributes</H3>

<ul>
<li>CSS property, descriptor, and pseudo-class names are delimited
by single quotes.
<li>CSS values are delimited by single quotes.
<li>Document language element names are in upper case letters.
<li>Document language attribute names are in lower case letters
and delimited by double quotes.
</ul>

<H3><a name="h-1.3.2">1.3.2</a> <a name="property-defs">CSS property definitions</a></H3>
<P>Each CSS property definition begins with a summary of key
information that resembles the following:

<P><strong>'Property-name'</strong>
<TABLE>
<TR><TH align="right">Value:<TD>Possible constant values or value types</TR>
<TR><TH align="right">Initial:<TD>The initial value</TR>
<TR><TH align="right">Applies to:<TD>Elements this property applies to</TR>
<TR><TH align="right">Inherited:<TD>Whether the property is inherited</TR>
<TR><TH align="right">Percentage values:<TD>How percentage values should be interpreted</TR>
</TABLE>

<P>The five categories have the following meanings:

<dl>
<dt><strong>Value</strong>
<dd>This part of the property definition specifies the set of valid
values for the property. Value types may be designated in several ways:

<ol>
<li> constant 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> non-terminals 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 non-terminal
name is the property name (complete with quotes) between "&lt;" and
"&gt;" (e.g., &lt;'border-width'&gt;). 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;"
(e.g., &lt;border-width&gt;) and its definition is located near its
first appearance in the specification. In the electronic version of
the document, each instance of this type of non-terminal links to the
corresponding value definition.
</ol>

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 alternatives: one of them must
occur.
<li>A double bar (A || B) means that either A or B or both must
occur, in any order.
<li>Brackets ([]) are for grouping.
</ul>

<P>Juxtaposition is stronger than the double bar, and the double bar
is stronger than the bar.

<div class="example"><P>
Thus, <samp>a b | c || d e</samp>
is equivalent to <samp>[ a b ] | [ c || [ d e ]]</samp>.
</div>

<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
      is repeated zero or more times.

    <LI>
      A plus (+) indicates that the preceding type, word or group is
      repeated 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 is repeated at least A and at most
      B times.
  </UL>


<div class="example"><P>
The following examples illustrate different value types:

<BLOCKQUOTE>
    <EM>Value:</EM> N | NW | NE<BR>
    <EM>Value:</EM> [ &lt;length&gt; | thick | thin ]{1,4}<BR>
    <EM>Value:</EM> [&lt;family-name&gt; , ]* &lt;family-name&gt;<BR>
    <EM>Value:</EM> &lt;url&gt;? &lt;color&gt; [ / &lt;color&gt; ]?<BR>
    <EM>Value:</EM> &lt;url&gt; || &lt;color&gt;<BR>
</BLOCKQUOTE>
</div>

<dt><strong>Initial</strong>

<dd>The property's initial value. If the property is inherited, this
is the value that is given to the root element of the <a
href="convent.html#doctree">document tree</a>. Please consult the
section on <a href="cascade.html">the cascade</a> for information
about the interaction between style sheet-specified, inherited, and
initial values.
</dd>

<dt><strong>Applies to</strong>

<dd>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, <a href="aural.html#propdef-voice-family" class="propinst"><span
class="propinst-voice-family">'voice-family'</span></a> has no effect if
the element is an image.
</dd>

<dt><strong>Inherited</strong>
<dd>Indicates whether the value of the property is inherited from a
ancestor element. Please consult the
section on <a href="cascade.html">the cascade</a> for information
about the interaction between style sheet-specified, inherited, and
initial values.
</dd>

<dt><strong>Percentage values</strong>
<dd>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.</dd>

<dt><strong>Applies to media</strong>
<dd>Indicates the <a href="media.html">media</a>
for which the property applies. The
<a href="convent.html">conformance</a> conditions state
that user agents must support this property if they support
rendering to the <a href="media.html">media types</a> listed
here.
</dd>
</dl>

<H4><a name="h-1.3.2.1">1.3.2.1</a> <a name="shorthand">Shorthand properties</a></H4>

<p>Some properties are <span class="index-def"
title="shorthand"><em>shorthand</em><a name="didx-shorthand">&nbsp;</a></span> rules that allow authors
to specify the values of several properties with a single property.

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

<P>When values are omitted from a shorthand form, each
"missing" property either inherits its value or is assigned
its initial value (see the section on <a href="cascade.html">the
cascade</a>).

<div class="example"><p>
The multiple style rules of the previous example:</p>

<pre>
  H1 {
    font-weight: bold;
    font-size: 12pt;
    line-height: 14pt;
    font-family: Helvetica;
    font-variant: normal;
    font-style: normal;
  }
</pre>

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

<pre>
  H1 { font: bold 12pt/14pt Helvetica }
</pre>

<p>In this example, <a href="fonts.html#propdef-font-variant" class="propinst"><span
class="propinst-font-variant">'font-variant'</span></a> and <a href="fonts.html#propdef-font-style" class="propinst"><span
class="propinst-font-style">'font-style'</span></a> have been omitted
from the shorthand form, so they must be assigned either
an inherited or initial value.</P>
</div>

<h3><a name="h-1.3.3">1.3.3</a> Notes and examples</h3>

<P>Informative notes are emphasized to stand out from surrounding
text and may be rendered specially by some user agents.

<P>All examples illustrating deprecated usage are marked as "DEPRECATED
EXAMPLE". Deprecated examples also include recommended alternate
solutions. All examples that illustrates illegal usage are clearly
marked as "ILLEGAL EXAMPLE".

<P>Examples and notes are marked within the source HTML for the
specification and some user agents may render them specially.

<H2><a name="h-1.4">1.4</a> Acknowledgments</H2>

<P>This specification is the product of the W3C Working Group on
Cascading Style Sheets and Formatting Properties. In addition to the
editors of this specification, the members of the Working Group are:

Brad Chase (Bitstream), Chris Wilson (Microsoft), Daniel Glazman
(Electricité de France), Dave Raggett (W3C/HP), Ed Tecot
(Microsoft), Jared Sorensen (Novell), Lauren Wood (SoftQuad), Laurie
Anna Kaplan (Microsoft), Mike Wexler (Adobe), Murray Maloney (Grif),
Powell Smith (IBM), Robert Stevahn (HP), Steve Byrne (JavaSoft),
Steven Pemberton (CWI), and Thom Phillabaum (Netscape). We thank them
for their continued efforts.

<P>A number of invited experts to the Working Group have contributed:
George Kersher, Glenn Rippel (Bitstream), Jeff Veen (HotWired), Markku
T. Hakkinen (The Productivity Works), Martin Dürst
(Universität Zürich), Roy Platon (RAL), Todd Fahrner (Verso)
and Vincent Quint (W3C).

<p>The section on Web Fonts was strongly shaped by Brad Chase (Bitstream)
David Meltzer (Microsoft Typography) and Steve Zilles (Adobe). The
following people have also contributed in various ways to the section
pertaining to fonts: Alex Beamon (Apple), Ashok Saxena (Adobe), Ben
Bauermeister (HP), Dave Raggett (W3C/HP), David Opstad (Apple), David
Goldsmith (Apple), Ed Tecot (Microsoft), Erik van Blokland
(LettError), François Yergeau (Alis), Gavin Nicol (Inso),
Herbert van Zijl (Elsevier), Liam Quin, Misha Wolf (Reuters), Paul
Haeberli (SGI), and the late Phil Karlton (Netscape).

<P>The section on Paged Media was in large parts authored by Robert
Stevahn (HP) and Stephen Waters (Microsoft).

<P>Robert Stevahn (HP), along with Scott Furman (Netscape) and Scott
Isaacs (Microsoft) were key contributors to CSS Positioning.

<P>Mike Wexler (Adobe) was the editor of the interim Working Draft
which described many of the new features of CSS2.

<p>T.V.Raman (Adobe) made pivotal contributions towards Aural
Cascading Style Sheets and the concepts of aural presentation.

<P>Todd Fahrner (Verso) researched contemporary and historical
browsers to develop the sample style sheet in the appendix.

<P>Through electronic and physical encounters, the following people
have contributed to the development of CSS2: James Clark, Dan
Connolly, Douglas Rand, Sho Kuwamoto, Donna Converse, Scott Isaacs,
Lou Montulli, Henrik Frystyk Nielsen, Jacob Nielsen, Vincent Mallet,
Philippe Le Hegaret, William Perry, David Siegel, Al Gilman, Jason
White, Daniel Dardailler.

<P>The discussions on www-style@w3.org have been influential in many
key issues for CSS. Especially, we would like to thank Bjorn Backlund,
Todd Fahrner, MegaZone, Eric Meyer, David Perrell, Liam Quinn, Chris
Wilson, Neil St.Laurent and Andrew Marshall for their participation.

<P>Special thanks to Arnaud Le Hors, whose engineering contributions
made this document work.

<P>Lastly, thanks to Tim Berners-Lee without whom none of this would
have been possible.

<div class="navbar">
<hr><center><a href="cover.html">previous</a> &nbsp; <a href="intro.html">next</a> &nbsp; <a href="cover.html#toc">contents</a> &nbsp; <a href="indexlist.html">index</a>
</center></div>
</BODY>
</HTML>