Permalink
Browse files

[selectors-4] Add :is(), resolves #1170

  • Loading branch information...
LeaVerou committed Dec 1, 2017
1 parent 33ae097 commit 5948b1ce37463aa7f87fede040fac9dd2c233329
Showing with 45 additions and 0 deletions.
  1. +45 −0 selectors-4/Overview.bs
View
@@ -1075,6 +1075,48 @@ The Matches-any Pseudo-class: '':matches()''</h3>
<pre>*|*:matches(*:hover, *:focus) </pre>
</div>
<h3 id="is">
The Specificity-adjustment Pseudo-class: '':is()''</h3>
The Specificity-adjustment pseudo-class '':is()'', is a functional pseudo-class
with the same syntax and functionality as '':matches()''.
Unlike '':matches()'', neither the pseudo-class, nor any of its arguments
contribute to the specificity of the selector.
This is useful for introducing filters in a selector while keeping it easy to override.
<div class="example">
Below is a common example where the specificity heuristic fails
to match author expectations:
<pre>
a:not(:hover) {
text-decoration: none;
}
nav a {
/* Has no effect */
text-decoration: underline;
}
</pre>
However, by using '':is()'' the author can explicitly declare their intent:
<pre>
a:is(:not(:hover)) {
text-decoration: none;
}
nav a {
/* Works now! */
text-decoration: underline;
}
</pre>
</div>
Note: Future versions of this specification may introduce a second argument to explicitly set
the specificity of each instance of this pseudo-class, which will default to zero.
<h3 id="negation">
The Negation Pseudo-class: '':not()''</h3>
@@ -3067,6 +3109,8 @@ Calculating a selector's specificity</h2>
The specificity of a '':matches()'' pseudo-class is replaced by
the specificity of its selector list argument.
(The full selector's specificity is equivalent to expanding out all the combinations in full, without '':matches()''.)
<li>
The specificity of an '':is()'' pseudo-class is replaced by 0.
<li>
Similarly, the specificity of an '':nth-child()'', '':nth-last-child()'', '':nth-of-type()'', or '':nth-last-of-type()'' selector
is the specificity of the pseudo class itself (counting as one pseudo-class selector)
@@ -3571,6 +3615,7 @@ Changes</h2>
Significant changes since the <a href="https://www.w3.org/TR/2013/WD-selectors4-20130502/">2 May 2013 Working Draft</a> include:
<ul>
<li>Added '':is()'' pseudo-class.</li>
<li>Split out <a>relative selectors</a> from <a>scoped selectors</a>,
as these are different concepts that can be independently invoked.
<li>Changed rules for absolutizing a relative selector.

0 comments on commit 5948b1c

Please sign in to comment.