@@ -84,7 +84,7 @@ Introduction</h2>
84
84
Properties values are assigned to various parts of the document
85
85
via [=property declarations=] ,
86
86
which assign the property a value
87
- (e.g. ''red'' , ''12pt'' , ''border/dotted'' )
87
+ (e.g. ''red'' , ''12pt'' , ''border-style /dotted'' )
88
88
for the associated element or box.
89
89
90
90
One of the fundamental design principles of CSS is <a lt="cascade">cascading</a> ,
@@ -160,13 +160,14 @@ Importing Style Sheets: the ''@import'' rule</h2>
160
160
161
161
<pre class='prod'>
162
162
@import [ <<url>> | <<string>> ]
163
- [ supports( [ <<supports-condition>> | <<declaration>> ] ) ]?
164
- <<media-query-list>> ? ;</pre>
163
+ <<import-conditions>> ;
164
+
165
+ <dfn export><import-conditions></dfn> = [ supports( [ <<supports-condition>> | <<declaration>> ] ) ]?
166
+ <<media-query-list>> ?</pre>
165
167
166
168
where the <<url>> or <<string>> gives the URL of the style sheet to be imported,
167
- and the optional [<<supports-condition>>|<<declaration>>] and <<media-query-list>>
168
- (collectively, the <dfn export>import conditions</dfn> )
169
- state the conditions under which it applies.
169
+ and the optional <<import-condition>>
170
+ state the [=import conditions=] under which it applies.
170
171
171
172
<div class="example">
172
173
The following <a href="#conditional-import">conditional <css>@import</css> rule</a>
@@ -195,7 +196,7 @@ Importing Style Sheets: the ''@import'' rule</h2>
195
196
<h3 id=conditional-import>
196
197
Conditional ''@import'' Rules</h3>
197
198
198
- The <a>import conditions</a > allow the import to be media– or feature-support–dependent.
199
+ <dfn export>Import conditions</dfn > allow the import to be media– or feature-support–dependent.
199
200
In the absence of any <a>import conditions</a> , the import is unconditional.
200
201
(Specifying ''@media/all'' for the <<media-query-list>> has the same effect.)
201
202
If the <a>import conditions</a> do not match,
@@ -226,7 +227,7 @@ Conditional ''@import'' Rules</h3>
226
227
<pre class='lang-css'>
227
228
@import url("fallback-layout.css") supports(not (display: flex));
228
229
@supports (display: flex) {
229
- ...
230
+ ...
230
231
}
231
232
</pre>
232
233
</div>
@@ -984,7 +985,7 @@ Cascade Sorting Order</h3>
984
985
<dt id='cascade-specificity'> Specificity
985
986
<dd>
986
987
The <a href="https://www.w3.org/TR/selectors/#specificity">Selectors module</a> [[!SELECT]] describes how to compute the specificity of a selector.
987
- Each declaration has the same specificity as the style rule it appears in.
988
+ Each [= declaration=] has the same specificity as the style rule it appears in.
988
989
For the purpose of this step,
989
990
declarations that do not belong to a style rule
990
991
(such as the <a href="https://www.w3.org/TR/css-style-attr/#interpret">contents of a style attribute</a> )
@@ -993,10 +994,12 @@ Cascade Sorting Order</h3>
993
994
994
995
<dt id='cascade-order'> Order of Appearance
995
996
<dd>
996
- The last declaration in document order wins.
997
+ The last [= declaration=] in document order wins.
997
998
For this purpose:
998
999
999
1000
<ul>
1001
+ <li> Style sheets are ordered
1002
+ in [[final CSS style sheets]] order.
1000
1003
<li> Declarations from <a at-rule lt="@import">imported style sheets</a>
1001
1004
are ordered as if their style sheets were substituted in place of the ''@import'' rule.
1002
1005
<li> Declarations from style sheets independently linked by the originating document
@@ -1314,6 +1317,7 @@ Non-trivial changes since the <a href="https://www.w3.org/TR/2022/CR-css-cascade
1314
1317
1315
1318
<!-- to 11 Jan 2022 -->
1316
1319
* Clarify that all “aliases” of a property are reverted by ''revert'' .
1320
+ * Clarify that style sheets are ordered in [[final CSS style sheets]] order.
1317
1321
1318
1322
<h3 id="changes-2021-10">
1319
1323
Changes since the 15 Oct 2021 Working Draft</h3>
0 commit comments