Справочник HTML & CSS

:where()

Работает как `:is()`, но всегда имеет нулевую специфичность.

Синтаксис

:where(list) { … }

Параметры

Параметр	Тип	Описание
list	selectors	Селекторы через запятую.

Примеры

:where(.card) p весит столько же, сколько p, поэтому побеждает правило ниже:

<style>
  :where(.card) p { color: gray; }
  p { color: crimson; }
</style>
 
<div class="card"><p>The plain p rule wins because :where() adds nothing.</p></div>

Примечания

:where() удобен для базовых стилей и библиотек: кто ими пользуется, перекроет любое правило простым селектором.

См. также

:is() — Срабатывает, если элемент подходит под любой селектор из списка, — способ сократить длинные списки селекторов.
@layer — Группирует стили в каскадные слои: более поздний слой побеждает независимо от специфичности.

В учебнике

Современные селекторы — Селекторы :is(), :where(), :not() со списком и :has() — как сократить длинные селекторы и выбрать родителя по его содержимому.

Спасибо, что читаете!