Skip to content

Commit 44e2c65

Browse files
committed
[selectors4] :where() has 0 specificity
The functional pseudo-class like :matches() with 0 specificity is named :where(). w3c#2143 (comment) resolves w3c#2143
1 parent 7d63748 commit 44e2c65

File tree

1 file changed

+8
-10
lines changed

1 file changed

+8
-10
lines changed

selectors-4/Overview.bs

+8-10
Original file line numberDiff line numberDiff line change
@@ -139,7 +139,7 @@ Selectors Overview</h2>
139139
<td>[[#matches]]
140140
<td>4
141141
<tr>
142-
<td><code>E:something(<var>s1</var>, <var>s2</var>, &hellip;)</code>
142+
<td><code>E:where(<var>s1</var>, <var>s2</var>, &hellip;)</code>
143143
<td>an E element that matches <a>compound selector</a> <var>s1</var>
144144
and/or <a>compound selector</a> <var>s2</var> but contributes no specificity.
145145
<td>[[#zero-matches]]
@@ -1199,20 +1199,18 @@ The Negation Pseudo-class: '':not()''</h3>
11991199

12001200

12011201
<h3 id="zero-matches">
1202-
The Specificity-adjustment Pseudo-class: '':something()''</h3>
1202+
The Specificity-adjustment Pseudo-class: '':where()''</h3>
12031203

1204-
The Specificity-adjustment pseudo-class, <dfn id="something-pseudo">:something()</dfn>,
1204+
The Specificity-adjustment pseudo-class, <dfn id="where-pseudo">:where()</dfn>,
12051205
is a functional pseudo-class
12061206
with the same syntax and functionality as '':matches()''.
1207-
Unlike '':matches()'', neither the '':something'' pseudo-class, nor any of its arguments
1207+
Unlike '':matches()'', neither the '':where'' pseudo-class, nor any of its arguments
12081208
contribute to the specificity of the selector--
12091209
its specificity is always zero.
12101210

12111211
This is useful for introducing filters in a selector
12121212
while keeping the associated style declarations easy to override.
12131213

1214-
ISSUE: This pseudo-class needs a name. See <a href="https://github.com/w3c/csswg-drafts/issues/1170">previous discussion</a>, <a href="https://github.com/w3c/csswg-drafts/issues/2143">open issue</a>.
1215-
12161214
<div class="example">
12171215
Below is a common example where the specificity heuristic fails
12181216
to match author expectations:
@@ -1228,10 +1226,10 @@ The Specificity-adjustment Pseudo-class: '':something()''</h3>
12281226
}
12291227
</pre>
12301228

1231-
However, by using '':something()'' the author can explicitly declare their intent:
1229+
However, by using '':where()'' the author can explicitly declare their intent:
12321230

12331231
<pre>
1234-
a:something(:not(:hover)) {
1232+
a:where(:not(:hover)) {
12351233
text-decoration: none;
12361234
}
12371235

@@ -3332,7 +3330,7 @@ Calculating a selector's specificity</h2>
33323330
The specificity of a '':not()'' pseudo-class is replaced by
33333331
the specificity of the most specific complex selector in its selector list argument.
33343332
<li>
3335-
The specificity of a '':something()'' pseudo-class is replaced by zero.
3333+
The specificity of a '':where()'' pseudo-class is replaced by zero.
33363334
</ul>
33373335

33383336
<div class="example">
@@ -3343,7 +3341,7 @@ Calculating a selector's specificity</h2>
33433341
a specificity of (0,0,1)--like a tag selector--when matched against <code>&lt;em></code>,
33443342
and a specificity of (1,0,0)--like an ID selector--when matched against <code>&lt;em id=foo></code>.
33453343
<li>
3346-
''div:something(em, #foo#bar#baz)'' has
3344+
''div:where(em, #foo#bar#baz)'' has
33473345
a specificity of (0,0,1): only the ''div'' contributes to selector specificity.
33483346
<li>
33493347
'':nth-child(even of li, .item)'' has

0 commit comments

Comments
 (0)