8000 csswg-drafts/css-cascade-3/Overview.bs at 9a6e7049b9f096a2551af0ee546241da28433c99 · w3c/csswg-drafts · GitHub
Skip to content

Overview.bs

Latest commit

 

History

History
965 lines (792 loc) · 41.5 KB

Overview.bs

File metadata and controls

965 lines (792 loc) · 41.5 KB
which overrides the corresponding declaration in the author's style sheet.
The declaration in the second rule will also win due to being marked ''!important''.
However, the third declaration in the user's style sheet is not ''!important''
and will therefore lose to the second rule in the author's style sheet
(which happens to set style on a <a>shorthand</a> property).
Also, the third author rule will lose to the second author rule since the second declaration is ''!important''.
This shows that ''!important'' declarations have a function also within author style sheets.
<pre>
/* From the user's style sheet */
p { text-indent: 1em !important }
p { font-style: italic !important }
p { font-size: 18pt }
/* From the author's style sheet */
p { text-indent: 1.5em !important }
p { font: normal 12pt sans-serif !important }
p { font-size: 24pt }
</pre>
<table class="data">
<thead>
<tr>
<th>Property
<th>Winning value
<tbody>
<tr>
<th>'text-indent'
<td>''1em''
<tr>
<th>'font-style'
<td>''font-style/italic''
<tr>
<th>'font-size'
<td>''12pt''
<tr>
<th>'font-family'
<td>''sans-serif''
</table>
</div>
<h3 id="preshint">
Precedence of Non-CSS Presentational Hints</h3>
The UA may choose to honor presentational hints in a source document's markup,
for example the <code>bgcolor</code> attribute or <{s}> element in [[HTML]].
All document language-based styling must be translated to corresponding CSS rules
and either enter the cascade at the user agent level or
be treated as author level rules with a specificity of zero placed at the start of the author style sheet.
A document language may define whether a presentational hint enters at the UA or author level of the cascade;
if so, the UA must behave accordingly.
For example, [[SVG11]] maps its presentation attributes into the author level.
Note: Presentational hints entering the cascade at the UA level can be overridden by author or user styles.
Presentational hints entering the cascade at the author level can be overridden by author styles,
but not by non-''!important'' user styles.
Host languages should choose the appropriate level for presentational hints with these considerations in mind.
<!--
████████ ████████ ████████ ███ ██ ██ ██ ████████
██ ██ ██ ██ ██ ██ ██ ██ ██ ██
██ ██ ██ ██ ██ ██ ██ ██ ██ ██
██ ██ ██████ ██████ ██ ██ ██ ██ ██ ██
██ ██ ██ ██ █████████ ██ ██ ██ ██
██ ██ ██ ██ ██ ██ ██ ██ ██ ██
████████ ████████ ██ ██ ██ ███████ ████████ ██
-->
<h2 id="defaulting">
Defaulting</h2>
When the <a>cascade</a> does not result in a value,
the <a>specified value</a> must be found some other way.
<a>Inherited properties</a> draw their defaults from their parent element through <a>inheritance</a>;
all other properties take their <a>initial value</a>.
Authors can explicitly request inheritance or initialization
via the ''inherit'' and ''initial'' keywords.
<h3 id="initial-values">
Initial Values</h3>
Each property has an <dfn export>initial value</dfn>,
defined in the property's definition table.
If the property is not an <a>inherited property</a>,
and the <a>cascade</a> does not result in a value,
then the <a>specified value</a> of the property is its <a>initial value</a>.
<h3 id="inheriting">
Inheritance</h3>
<dfn export lt="inheritance|inherit">Inheritance</dfn> propagates property values from parent elements to their children.
The <dfn export>inherited value</dfn> of a property on an element
is the <a>computed value</a> of the property on the element's parent element.
For the root element,
which has no parent element,
the <a>inherited value</a> is the <a>initial value</a> of the property.
(Pseudo-elements inherit according to a fictional tag sequence described for each pseudo-element [[!SELECT]].)
Some properties are <dfn export lt="inherited property">inherited properties</dfn>,
as defined in their property definition table.
This means that,
unless the cascade results in a value,
the value will be determined by inheritance.
A property can also be explicitly inherited. See the ''inherit'' keyword.
Note: Inheritance follows the document tree and is not intercepted by <a href="https://www.w3.org/TR/CSS21/visuren.html#box-gen">anonymous boxes</a>,
or otherwise affected by manipulations of the box tree.
<h3 id="defaulting-keywords">
Explicit Defaulting</h3>
Several CSS-wide property values are defined below;
declaring a property to have these values explicitly specifies a particular defaulting behavior.
As specified in <a href="https://www.w3.org/TR/css3-values/#common-keywords">CSS Values and Units Level 3</a> [[!CSS3VAL]],
all CSS properties can accept these values.
9314
<h4 id="initial">
Resetting a Property: the ''initial'' keyword</h4>
If the <a>cascaded value</a> is the <dfn for=all>''initial''</dfn> keyword,
the property's <a>initial value</a> becomes its <a>specified value</a>.
<h4 id="inherit">
Explicit Inheritance: the ''inherit'' keyword</h4>
If the <a>cascaded value</a> of a property is the <dfn for=all>''inherit''</dfn> keyword,
the <a>inherited value</a> becomes the property's <a lt="specified value">specified</a> and <a>computed values</a>.
<h4 id="inherit-initial">
Erasing All Declarations: the ''unset'' keyword</h4>
If the <a>cascaded value</a> of a property is the <dfn for=all>''unset''</dfn> keyword,
then if it is an inherited property, this is treated as ''inherit'',
and if it is not, this is treated as ''initial''.
This keyword effectively erases all <a>declared values</a> occurring earlier in the <a>cascade</a>,
correctly inheriting or not as appropriate for the property
(or all longhands of a <a>shorthand</a>).
<!--
████████ ████████ ██████
██ ██ ██ ██
██ ██ ██
██████ ██ ██
██ ██ ██
██ ██ ██ ██
████████ ██ ██████
-->
<h2 id="changes">
Changes</h2>
<h3 id="changes-2013">
Changes Since the 3 October 2013 Candidate Recommendation</h3>
The following changes were made to this specification since the
<a href="https://www.w3.org/TR/2013/CR-css-cascade-3-20131003/">3 October 2013 Candidate Recommendation</a>:
<ul>
<li>Defined <a>environment encoding</a> of imported style sheets.
<blockquote>
<ins><p>The <a>environment encoding</a> of an imported style sheet is the encoding of the style sheet that imported it. [[CSS3SYN]]</p></ins>
</blockquote>
<li>Referenced [[!CSS3SYN]] for syntax of ''!important'' rules.
<blockquote>
<p>A declaration is <a>important</a> if it has a ''!important'' annotation,
<ins>as defined by [[CSS3SYN]]</ins>.
</blockquote>
<li>Explained <a>reset-only sub-properties</a>
and clarified that they also get affected by a CSS-wide keyword value in the shorthand declaration.
<blockquote>
<p><ins>In other cases, a property might be a <a>reset-only sub-property</a> of the shorthand:
Like other <a>sub-properties</a>, it is reset to its initial value by the shorthand when unspecified,
but the shorthand might not include syntax to set the <a>sub-property</a>
to any of its other values.
For example, the 'border' shorthand resets 'border-image'
to its initial value of ''border-image/none'',
but has no syntax to set it to anything else. [[CSS3BG]]</ins></p>
<p>If a <a>shorthand</a> is specified as one of the <a href="https://www.w3.org/TR/css3-values/#common-keywords">CSS-wide keywords</a> [[!CSS3VAL]],
it sets all of its <a>sub-properties</a> to that keyword,
<ins>including any that are <a>reset-only sub-properties</a></ins>.
(Note that these keywords cannot be combined with other values in a single declaration, not even in a shorthand.)</p>
</blockquote>
</ul>
<p>A <a href="https://drafts.csswg.org/css-cascade-3/issues-cr-2013">Disposition of Comments</a> is available.
<h3 id="changes-2">
Additions to Level 2</h3>
The following features have been added since
<a href="http://www.w3.org/TR/CSS2/cascade.html">Level 2</a>:
<ul>
<li>The 'all' shorthand
<li>The ''unset'' keyword
<li>Incorporation of animations and transitions into the <a>cascade</a>.
</ul>
<h2 class="no-num" id="acknowledgments">Acknowledgments</h2>
David Baron, Simon Sapin, and Boris Zbarsky contributed to this specification.
<h2 class="no-num" id="priv-sec">
Privacy and Security Considerations</h2>
Issue: Something about ''@import'', since it's linking to other documents?