@@ -397,28 +397,28 @@ Scoping Styles: the ''@scope'' rule</h4>
397
397
* Selectors can only match elements that are [=in scope=] .
398
398
This only applies to the [=subject=] ;
399
399
the rest of the selector can match unrestricted.
400
- * Selectors are given the added specificity of
401
- the most specific [=complex selector=] in the <<scope-start>> argument.
402
-
403
- Note: This is designed to match the behavior of the '':is()'' selector.
404
400
405
401
* The [=cascade=] prioritizes declarations
406
402
with a [=scope proximity|more proximate=] [=scoping root=] ,
407
403
regardless of specificity or source order.
408
404
405
+ Note: Unlike <a href="https://www.w3.org/TR/css-nesting/">Nesting</a> ,
406
+ selectors within an ''@scope'' rule
407
+ do not acquire the specificity of any parent selector(s) in the ''@scope'' prelude.
408
+
409
409
<div class=example>
410
- The following selectors have the same specificity (1 ,0,1):
410
+ The following selectors have the same specificity (0 ,0,1):
411
411
412
412
<pre class=lang-css>
413
413
@scope (#hero) {
414
414
img { border-radius: 50%; }
415
415
}
416
416
417
- #hero img { border-radius: 50%; }
417
+ :where( #hero) img { border-radius: 50%; }
418
418
</pre>
419
419
420
- But because <{img}> is scoped,
421
- it is weighted more strongly in the cascade.
420
+ But because one <{img}> selector is scoped,
421
+ that selector is weighted more strongly in the cascade.
422
422
</div>
423
423
424
424
<div class=example>
0 commit comments