11<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
22<html lang="en">
3- <!-- $Id: cascade.src,v 2.46 2003-10-17 17:52:46 bbos Exp $ -->
3+ <!-- $Id: cascade.src,v 2.47 2004-02-14 00:59:12 bbos Exp $ -->
44<HEAD>
55<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
66<TITLE>Assigning property values, Cascading, and Inheritance</TITLE>
7+ <!-- Changed by Kimberly Blessing, 2004-02-13 -->
78</HEAD>
89<BODY>
910
@@ -22,11 +23,11 @@ calculation: the value is determined through specification (the
2223(the "computed value"), and finally transformed according to
2324the limitations of the local environment (the "actual value").
2425
25- <h3>
26- <span class="index-def" title="specified value">
26+
27+ <h3>< span class="index-def" title="specified value">
2728<a name="specified-value">Specified values</a></span></h3>
2829
29- <p>User agents must first assign a specified value to a property based
30+ <p>User agents must first assign a specified value to each property based
3031on the following mechanisms (in order of precedence):</p>
3132
3233<ol>
@@ -35,22 +36,17 @@ on the following mechanisms (in order of precedence):</p>
3536<li>Otherwise use the property's <span class="index-def" title="initial value">initial value</span>. The initial value of each property is indicated in the property's definition.
3637</ol>
3738
38- <p>Since it has no parent, the root of the <a
39- href="conform.html#doctree">document tree</a> cannot use values from
40- the parent element; in this case, the initial value is used if
41- necessary.
42-
4339
4440<h3><span class="index-def" title="computed value">
45- <a name="computed-value">Computed values</a>
46- </span>
47- </h3>
41+ <a name="computed-value">Computed values</a></span></h3>
42+
43+ <p>Specified values are resolved to computed values during the cascade;
44+ for example valid relative URIs are made absolute and 'em' and 'ex'
45+ units are computed to pixel or absolute lengths. Computing a value
46+ never requires the user agent to render the document.
4847
49- <p>Specified values may be absolute (i.e., they are not specified
50- relative to another value, as in 'red' or '2mm') or relative (i.e.,
51- they are specified relative to another value, as in 'auto', '2em', and
52- '12%'). For absolute values, no computation is needed to find the
53- computed value.
48+ <p>The computed value of invalid and absolute URIs is the specified
49+ value.
5450
5551<p>Relative values, on the other hand, must be transformed into
5652computed values: percentages must be multiplied by a reference value
@@ -74,15 +70,27 @@ properties may define the computed value of a property for an element
7470to depend on whether the property applies to that element.
7571
7672
73+ <h3><span class="index-def" title="used value">
74+ <a name="used-value">Used values</a></span></h3>
75+
76+ <p>Computed values can be relative to each other; for example a width
77+ could be set as a percentage, which is dependent on the containing
78+ block's width. The <dfn id="usedValue">used value</dfn> is the
79+ result of taking the computed value and resolving these dependencies
80+ into a final absolute value used for the actual layout.
81+
82+
7783<h3><span class="index-def" title="actual value">
7884<a name="actual-value">Actual values</a></span></h3>
7985
80- <p>A computed value is in principle ready to be used, but a user agent
81- may not be able to make use of the value in a given environment. For
82- example, a user agent may only be able to render borders with integer
83- pixel widths and may therefore have to approximate the computed
84- width. The actual value is the computed value after any approximations
85- have been applied.
86+ <p>A used value is in principle the value used for rendering, but a
87+ user agent may not be able to make use of the value in a given
88+ environment. For example, a user agent may only be able to render
89+ borders with integer pixel widths and may therefore have to
90+ approximate the computed width, or the user agent may be forced to
91+ use only black and white shades instead of full colour. The actual
92+ value is the used value after any approximations have been applied.
93+
8694
8795<h2><a name="inheritance">Inheritance</a></h2>
8896
@@ -114,7 +122,7 @@ For example, given the following style sheet:</P>
114122
115123<pre>
116124body { font-size: 10pt }
117- h1 { font-size: 120 % }
125+ h1 { font-size: 130 % }
118126</pre>
119127
120128<p>and this document fragment:
@@ -126,13 +134,13 @@ h1 { font-size: 120% }
126134</pre>
127135
128136<p>the <span class="prop-inst-font-size">'font-size'</span> property
129- for the H1 element will have the computed value '12pt ' (120 % times
137+ for the H1 element will have the computed value '13pt ' (130 % times
13013810pt, the parent's value). Since the computed value of <span
131139class="propinst-font-size">'font-size'</span> is inherited, the EM
132- element will have the computed value '12pt ' as well. If the
133- user agent does not have the 12pt font available, the
140+ element will have the computed value '13pt ' as well. If the
141+ user agent does not have the 13pt font available, the
134142actual value of <span class="propinst-font-size">'font-size'</span>
135- for both H1 and EM might be, for example, '11pt '.
143+ for both H1 and EM might be, for example, '12pt '.
136144</div>
137145
138146<h3>The <span class="index-def" title="inherit, definition
@@ -239,10 +247,16 @@ browsers, the EM element in HTML is presented using an italic
239247font). See <a href="sample.html">A sample style sheet for HTML
240248</a> for a recommended default style sheet for HTML documents.
241249
242- <P>Note that the default style sheet may change if system settings are
243- modified by the user (e.g., system colors). However, due to
244- limitations in a user agent's internal implementation, it may be
245- impossible to change the values in the default style sheet.
250+ <p class="note">Note that the user may modify system settings (e.g.
251+ system colors) that affect the default style sheet. However, some user
252+ agent implementations make it impossible to change the values in the
253+ default style sheet.
254+
255+
256+ Note that the user may modify system settings
257+ (e.g. system colors) that affect the default style sheet. However,
258+ some user agent implementations make it impossible to change the
259+ values in the default style sheet.
246260</ul>
247261
248262<P>Style sheets from these three origins will overlap in scope, and
@@ -257,10 +271,6 @@ rules in user style sheets. Precedence is reversed, however, for
257271"!important" rules. All user and author rules have more weight
258272than rules in the UA's default style sheet.
259273
260- <P>Rules specified in a given style sheet override rules of the same
261- weight imported from other style sheets. Imported style sheets can
262- themselves import and override other style sheets, recursively, and
263- the same precedence rules apply.
264274
265275<H3><a name="cascading-order">Cascading order</a></H3>
266276
@@ -274,7 +284,7 @@ must apply the following sorting order:</p>
274284 Declarations apply if the associated selector <A
275285 HREF="selector.html">matches</A> the element in question.
276286
277- <LI>Sort by weight (normal or important) and origin (author, user, or user agent). In ascending order:
287+ <LI>Sort by importance (normal or important) and origin (author, user, or user agent). In ascending order:
278288
279289<ol>
280290<li>user agent style sheets
@@ -311,23 +321,20 @@ and user style sheets. By default, rules in an author's style
311321sheet override those in a user's style sheet (see cascade
312322rule 3).
313323
314- <P>However, for balance, an "!important" declaration (the keywords "!"
315- and "important" follow the declaration) takes precedence over a normal
316- declaration. Both author and user style sheets may contain
324+ <P>However, for balance, an "!important" declaration (the delimiter token
325+ "!" and keyword "important" follow the declaration) takes precedence over
326+ a normal declaration. Both author and user style sheets may contain
317327"!important" declarations, and user "!important" rules override author
318328"!important" rules. This CSS feature improves accessibility
319329of documents by giving users with special requirements (large
320330fonts, color combinations, etc.) control over presentation.
321331
322-
323-
324332<P>Declaring a <span class="index-inst" title="shorthand
325333property">shorthand property</span> (e.g., <span
326334class="propinst-background">'background'</span>) to be "!important" is
327335equivalent to declaring all of its sub-properties to be "!important".
328336
329337<div class="example">
330-
331338<P>The first rule in the user's style sheet in the following example
332339contains an "!important" declaration, which overrides the corresponding
333340declaration in the author's style sheet. The second declaration
@@ -347,7 +354,7 @@ p { font-size: 18pt }
347354
348355/* From the author's style sheet */
349356p { text-indent: 1.5em !important }
350- p { font: 12pt sans-serif !important }
357+ p { font: normal 12pt sans-serif !important }
351358p { font-size: 24pt }
352359</PRE>
353360</div>
@@ -418,7 +425,7 @@ defined as an "ID" in the source document's DTD.
418425
419426<H3>Precedence of non-CSS presentational hints</H3>
420427
421- <P>The UA may choose to honor presentational attributes in the source
428+ <P>The UA may choose to honor presentational attributes an HTML source
422429document. If so, these attributes are translated to the corresponding
423430CSS rules with specificity equal to 0, and are treated as if they were
424431inserted at the start of the author style sheet. They may therefore be
@@ -437,13 +444,11 @@ onclick, ondblclick, onfocus, onkeydown, onkeypress, onkeyup, onload,
437444onload, onmousedown, onmousemove, onmouseout, onmouseover, onmouseup,
438445onreset, onselect, onsubmit, onunload, onunload, profile, prompt,
439446readonly, rel, rev, rowspan, scheme, scope, selected, shape, span,
440- src, standby, start, style, summary, title, type, usemap, value,
441- valuetype, version.
447+ src, standby, start, style, summary, title, type (except on LI, OL and
448+ UL elements), usemap, value, valuetype, version.
442449
443- <P>For XHTML and other languages written in XML, no attribute should
444- be considered presentational. The styling of elements and
445- non-presentational attributes should be handled in the user agent
446- stylesheet.
450+ <P>For other languages, all document language-based styling should be
451+ handled in the user agent style sheet.
447452
448453<div class="example">
449454
0 commit comments