:is()
Matches an element that matches any selector in the list — a way to shorten long selector lists.
Syntax
:is(list) { … }Parameters
| Parameter | Type | Description |
|---|---|---|
| list | selectors | Selectors separated by commas; an invalid one is skipped, not the whole rule. |
Examples
One rule instead of four combinations:
<style>
:is(article, aside) :is(h3, h4) { color: darkorange; }
</style>
<article><h3>Article heading</h3></article>
<aside><h4>Sidebar heading</h4></aside>
<h3>An ordinary heading</h3>Notes
The specificity of :is() is that of its strongest argument: :is(#id, p) weighs as much as an id. If you need zero specificity, use :where().
See also
In the tutorial
- Modern selectors — The :is(), :where(), :not() with a list and :has() selectors — how to shorten long selectors and pick a parent by its content.