Skip to content

Commit 85fbc2a

Browse files
committed
[css-cascade] Actually define what @import does.
1 parent 6560b43 commit 85fbc2a

2 files changed

Lines changed: 45 additions & 27 deletions

File tree

css-cascade/Overview.html

Lines changed: 32 additions & 23 deletions
Original file line numberDiff line numberDiff line change
@@ -157,6 +157,15 @@ <h2 data-level=2 id=at-import><span class=secno>2 </span><span class=content>
157157
<!--
158158
-->@import url("mystyle.css");</pre> </div>
159159

160+
<p> If an <a class=css data-link-type=maybe href=#at-ruledef-import>@import</a> rule refers to a valid stylesheet,
161+
user agents must treat the contents of the stylesheet as if they were written in place of the <a class=css data-link-type=maybe href=#at-ruledef-import>@import</a> rule.
162+
163+
<p class=example>
164+
For example, declarations in style rules from imported stylesheets interact with the cascade
165+
as if they were written literally into the stylesheet at the point of the <a class=css data-link-type=maybe href=#at-ruledef-import>@import</a>.
166+
Similarly, style rules in a stylesheet imported into a scoped stylesheet
167+
are scoped in the same way.
168+
160169
<p>
161170
So that user agents can avoid retrieving resources for unsupported media types,
162171
authors may specify media-dependent <a class=css data-link-type=maybe href=#at-ruledef-import>@import</a> rules.
@@ -270,8 +279,8 @@ <h2 data-level=3 id=shorthand><span class=secno>3 </span><span class=content>
270279
(Note that these keywords cannot be combined with other values in a single declaration, not even in a shorthand.)
271280

272281
<p>
273-
Declaring a <a href=#shorthand-properties>shorthand</a> property to be <a class=css data-link-type=maybe href=#valuedef-important>!important</a>
274-
is equivalent to declaring all of its <a href=#longhand-sub-properties>sub-properties</a> to be <a class=css data-link-type=maybe href=#valuedef-important>!important</a>.
282+
Declaring a <a href=#shorthand-properties>shorthand</a> property to be <a class=css data-link-type=maybe href=#important>!important</a>
283+
is equivalent to declaring all of its <a href=#longhand-sub-properties>sub-properties</a> to be <a class=css data-link-type=maybe href=#important>!important</a>.
275284

276285

277286
<h3 data-level=3.1 id=all-shorthand><span class=secno>3.1 </span><span class=content>
@@ -280,7 +289,7 @@ <h3 data-level=3.1 id=all-shorthand><span class=secno>3.1 </span><span class=con
280289
<table class=propdef>
281290
<tr>
282291
<th>Name:
283-
<td><dfn data-dfn-type=property id=all>all</dfn><tr>
292+
<td><dfn data-dfn-type=property id=propdef-all>all</dfn><tr>
284293
<th>Value:
285294
<td>initial | inherit | unset
286295
<tr>
@@ -686,7 +695,7 @@ <h2 data-level=6 id=cascading><span class=secno>6 </span><span class=content>
686695
<dt id=cascade-origin>Origin and Importance
687696
<dd>
688697
The <a href=#origin>origin</a> of a declaration is based on where it comes from
689-
and its <a href=#important title=important>importance</a> is whether or not it is declared <a class=css data-link-type=maybe href=#valuedef-important>!important</a> (see below).
698+
and its <a href=#important0 title=important>importance</a> is whether or not it is declared <a class=css data-link-type=maybe href=#important>!important</a> (see below).
690699
The precedence of the various <a href=#origin>origins</a> is, in descending order:
691700

692701
<ol>
@@ -817,27 +826,27 @@ <h3 data-level=6.1 id=cascading-origins><span class=secno>6.1 </span><span class
817826
</dl>
818827

819828
<h3 data-level=6.2 id=importance><span class=secno>6.2 </span><span class=content>
820-
Important Declarations: the <a class=css data-link-type=maybe href=#valuedef-important>!important</a> annotation</span><a class=section-link href=#importance>§</a></h3>
829+
Important Declarations: the <a class=css data-link-type=maybe href=#important>!important</a> annotation</span><a class=section-link href=#importance>§</a></h3>
821830

822831
<p>
823832
CSS attempts to create a balance of power between author and user style sheets.
824833
By default, rules in an author's style sheet override those in a user's style sheet,
825834
which override those in the user-agent's default style sheet.
826-
To balance this, a declaration can be made <dfn data-dfn-type=dfn id=important>important</dfn>,
835+
To balance this, a declaration can be made <dfn data-dfn-type=dfn id=important0>important</dfn>,
827836
which increases its weight in the cascade and inverts the order of precedence.
828837

829838
<p>
830-
A declaration is <a href=#important>important</a> if it has a <dfn data-dfn-type=value id=valuedef-important><a class=css data-link-type=maybe href=#valuedef-important>!important</a></dfn> annotation,
839+
A declaration is <a href=#important0>important</a> if it has a <dfn data-dfn-type=dfn id=important>!important</dfn> annotation,
831840
i.e. if the last two (non-whitespace, non-comment) tokens
832-
in its value are the delimiter token <span class=css data-link-type=maybe>!</span> followed by the identifier token <a class=css data-link-type=maybe href=#important>important</a>.
841+
in its value are the delimiter token <span class=css data-link-type=maybe>!</span> followed by the identifier token <a class=css data-link-type=maybe href=#important0>important</a>.
833842

834843
<div class=example>
835844
<pre>[hidden] { display: none !important; }</pre> </div>
836845

837846
<p>
838-
An <a href=#important>important</a> declaration takes precedence over a normal declaration.
839-
Author and user style sheets may contain <a class=css data-link-type=maybe href=#valuedef-important>!important</a> declarations,
840-
with user <a class=css data-link-type=maybe href=#valuedef-important>!important</a> declarations overriding author <a class=css data-link-type=maybe href=#valuedef-important>!important</a> declarations.
847+
An <a href=#important0>important</a> declaration takes precedence over a normal declaration.
848+
Author and user style sheets may contain <a class=css data-link-type=maybe href=#important>!important</a> declarations,
849+
with user <a class=css data-link-type=maybe href=#important>!important</a> declarations overriding author <a class=css data-link-type=maybe href=#important>!important</a> declarations.
841850
This CSS feature improves accessibility of documents by giving users with special requirements
842851
(large fonts, color combinations, etc.)
843852
control over presentation.
@@ -849,19 +858,19 @@ <h3 data-level=6.2 id=importance><span class=secno>6.2 </span><span class=conten
849858
<a data-biblio-type=informative data-link-type=biblio href=#css3-animations title=CSS3-ANIMATIONS>[CSS3-ANIMATIONS]</a>
850859

851860
<p>
852-
User agent style sheets may also contain <a class=css data-link-type=maybe href=#valuedef-important>!important</a> declarations.
861+
User agent style sheets may also contain <a class=css data-link-type=maybe href=#important>!important</a> declarations.
853862
These override all author and user declarations.
854863

855864
<div class=example>
856865
<p>
857-
The first rule in the user's style sheet in the following example contains an <a class=css data-link-type=maybe href=#valuedef-important>!important</a> declaration,
866+
The first rule in the user's style sheet in the following example contains an <a class=css data-link-type=maybe href=#important>!important</a> declaration,
858867
which overrides the corresponding declaration in the author's style sheet.
859-
The declaration in the second rule will also win due to being marked <a class=css data-link-type=maybe href=#valuedef-important>!important</a>.
860-
However, the third declaration in the user's style sheet is not <a class=css data-link-type=maybe href=#valuedef-important>!important</a>
868+
The declaration in the second rule will also win due to being marked <a class=css data-link-type=maybe href=#important>!important</a>.
869+
However, the third declaration in the user's style sheet is not <a class=css data-link-type=maybe href=#important>!important</a>
861870
and will therefore lose to the second rule in the author's style sheet
862871
(which happens to set style on a <a href=#shorthand-properties>shorthand</a> property).
863-
Also, the third author rule will lose to the second author rule since the second declaration is <a class=css data-link-type=maybe href=#valuedef-important>!important</a>.
864-
This shows that <a class=css data-link-type=maybe href=#valuedef-important>!important</a> declarations have a function also within author style sheets.
872+
Also, the third author rule will lose to the second author rule since the second declaration is <a class=css data-link-type=maybe href=#important>!important</a>.
873+
This shows that <a class=css data-link-type=maybe href=#important>!important</a> declarations have a function also within author style sheets.
865874

866875
<pre>/* From the user's style sheet */
867876
p { text-indent: 1em !important }
@@ -955,21 +964,21 @@ <h4 data-level=7.3.1 id=initial><span class=secno>7.3.1 </span><span class=conte
955964
Resetting a Property: the <a class=css data-link-type=maybe href=#valuedef-initial>initial</a> keyword</span><a class=section-link href=#initial>§</a></h4>
956965

957966
<p>
958-
If the <a href=#cascaded-value>cascaded value</a> is the <dfn data-dfn-type=value id=valuedef-initial><a class=css data-link-type=maybe href=#valuedef-initial>initial</a></dfn> keyword,
967+
If the <a href=#cascaded-value>cascaded value</a> is the <dfn data-dfn-for=all data-dfn-type=value id=valuedef-initial><a class=css data-link-type=maybe href=#valuedef-initial>initial</a></dfn> keyword,
959968
the property's <a href=#initial-value>initial value</a> becomes its <a href=#specified-value>specified value</a>.
960969

961970
<h4 data-level=7.3.2 id=inherit><span class=secno>7.3.2 </span><span class=content>
962971
Explicit Inheritance: the <a class=css data-link-type=maybe href=#valuedef-inherit>inherit</a> keyword</span><a class=section-link href=#inherit>§</a></h4>
963972

964973
<p>
965-
If the <a href=#cascaded-value>cascaded value</a> of a property is the <dfn data-dfn-type=value id=valuedef-inherit><a class=css data-link-type=maybe href=#valuedef-inherit>inherit</a></dfn> keyword,
974+
If the <a href=#cascaded-value>cascaded value</a> of a property is the <dfn data-dfn-for=all data-dfn-type=value id=valuedef-inherit><a class=css data-link-type=maybe href=#valuedef-inherit>inherit</a></dfn> keyword,
966975
the <a href=#inherited-value>inherited value</a> becomes the property's <a href=#specified-value title="specified value">specified</a> and <a href=#computed-value>computed values</a>.
967976

968977
<h4 data-level=7.3.3 id=inherit-initial><span class=secno>7.3.3 </span><span class=content>
969978
Erasing All Declarations: the <a class=css data-link-type=maybe href=#valuedef-unset>unset</a> keyword</span><a class=section-link href=#inherit-initial>§</a></h4>
970979

971980
<p>
972-
If the <a href=#cascaded-value>cascaded value</a> of a property is the <dfn data-dfn-type=value id=valuedef-unset><a class=css data-link-type=maybe href=#valuedef-unset>unset</a></dfn> keyword,
981+
If the <a href=#cascaded-value>cascaded value</a> of a property is the <dfn data-dfn-for=all data-dfn-type=value id=valuedef-unset><a class=css data-link-type=maybe href=#valuedef-unset>unset</a></dfn> keyword,
973982
then if it is an inherited property, this is treated as <a class=css data-link-type=maybe href=#valuedef-inherit>inherit</a>,
974983
and if it is not, this is treated as <a class=css data-link-type=maybe href=#valuedef-initial>initial</a>.
975984
This keyword effectively erases all <a href=#declared-value>declared values</a> occurring earlier in the <a href=#cascade>cascade</a>,
@@ -988,7 +997,7 @@ <h3 data-level=8.1 id=changes-2013><span class=secno>8.1 </span><span class=cont
988997
<p><ul>
989998
<li>Dropped the <span class=css data-link-type=maybe>default</span> keyword.
990999
<li>Added the <a class=css data-link-type=maybe href=#valuedef-unset>unset</a> keyword.
991-
<li>Excluded <a class=property data-link-type=propdesc href=http://www.w3.org/TR/css3-writing-modes/#unicode-bidi0 title=unicode-bidi>unicode-bidi</a> and <a class=property data-link-type=propdesc href=http://www.w3.org/TR/css3-writing-modes/#direction0 title=direction>direction</a> from the <a class=property data-link-type=propdesc href=#all title=all>all</a> shorthand.
1000+
<li>Excluded <a class=property data-link-type=propdesc href=http://www.w3.org/TR/css3-writing-modes/#unicode-bidi0 title=unicode-bidi>unicode-bidi</a> and <a class=property data-link-type=propdesc href=http://www.w3.org/TR/css3-writing-modes/#direction0 title=direction>direction</a> from the <a class=property data-link-type=propdesc href=#propdef-all title=all>all</a> shorthand.
9921001
<li>Various clarifications.
9931002
</ul>
9941003

@@ -1136,8 +1145,8 @@ <h2 class="no-num no-ref" id=index><span class=content>
11361145
<li>computed value, <a href=#computed-value title="section 4.4">4.4</a>
11371146
<li>declared value, <a href=#declared-value title="section 4.1">4.1</a>
11381147
<li>@import, <a href=#at-ruledef-import title="section 2">2</a>
1139-
<li>important, <a href=#important title="section 6.2">6.2</a>
1140-
<li>!important (value), <a href=#valuedef-important title="section 6.2">6.2</a>
1148+
<li>important, <a href=#important0 title="section 6.2">6.2</a>
1149+
<li>!important, <a href=#important title="section 6.2">6.2</a>
11411150
<li>&lt;import-rule&gt;, <a href=#typedef-import-rule title="section 2">2</a>
11421151
<li>Inheritance, <a href=#inheritance title="section 7.2">7.2</a>
11431152
<li>inherited properties, <a href=#inherited-properties title="section 7.2">7.2</a>

css-cascade/Overview.src.html

Lines changed: 13 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -66,6 +66,15 @@ <h2 id="at-import">
6666
-->@import url("mystyle.css");</pre>
6767
</div>
6868

69+
If an ''@import'' rule refers to a valid stylesheet,
70+
user agents must treat the contents of the stylesheet as if they were written in place of the ''@import'' rule.
71+
72+
<p class='example'>
73+
For example, declarations in style rules from imported stylesheets interact with the cascade
74+
as if they were written literally into the stylesheet at the point of the ''@import''.
75+
Similarly, style rules in a stylesheet imported into a scoped stylesheet
76+
are scoped in the same way.
77+
6978
<p>
7079
So that user agents can avoid retrieving resources for unsupported media types,
7180
authors may specify media-dependent ''@import'' rules.
@@ -739,7 +748,7 @@ <h3 id='importance'>
739748
which increases its weight in the cascade and inverts the order of precedence.
740749

741750
<p>
742-
A declaration is <i>important</i> if it has a <dfn>''!important''</dfn> annotation,
751+
A declaration is <i>important</i> if it has a <dfn>!important</dfn> annotation,
743752
i.e. if the last two (non-whitespace, non-comment) tokens
744753
in its value are the delimiter token ''!'' followed by the identifier token ''important''.
745754

@@ -870,21 +879,21 @@ <h4 id="initial">
870879
Resetting a Property: the ''initial'' keyword</h4>
871880

872881
<p>
873-
If the <i>cascaded value</i> is the <dfn>''initial''</dfn> keyword,
882+
If the <i>cascaded value</i> is the <dfn for=all>''initial''</dfn> keyword,
874883
the property's <i>initial value</i> becomes its <i>specified value</i>.
875884

876885
<h4 id="inherit">
877886
Explicit Inheritance: the ''inherit'' keyword</h4>
878887

879888
<p>
880-
If the <i>cascaded value</i> of a property is the <dfn>''inherit''</dfn> keyword,
889+
If the <i>cascaded value</i> of a property is the <dfn for=all>''inherit''</dfn> keyword,
881890
the <i>inherited value</i> becomes the property's <i title="specified value">specified</i> and <i>computed values</i>.
882891

883892
<h4 id="inherit-initial">
884893
Erasing All Declarations: the ''unset'' keyword</h4>
885894

886895
<p>
887-
If the <i>cascaded value</i> of a property is the <dfn>''unset''</dfn> keyword,
896+
If the <i>cascaded value</i> of a property is the <dfn for=all>''unset''</dfn> keyword,
888897
then if it is an inherited property, this is treated as ''inherit'',
889898
and if it is not, this is treated as ''initial''.
890899
This keyword effectively erases all <i>declared values</i> occurring earlier in the <i>cascade</i>,

0 commit comments

Comments
 (0)