Псевдокласс :where() в CSS

Псевдокласс :where() в CSS


Псевдокласс :where() работает аналогично :is(), но с одной важной особенностью – он всегда имеет нулевую специфичность.

Как это работает?

:where() позволяет применять стили ко множеству селекторов, при этом не увеличивая специфичность.

Пример:

css
:where(h1, h2, h3) {
  margin-bottom: 1rem;
  color: #333;
}

Такой код применит стили ко всем заголовкам, но если позже вы захотите переопределить эти стили через класс или ID, это будет легко сделать.

Преимущества:

  • Гибкость: Легко переопределять стили в будущем.
  • Идеально для базовых стилей: Отлично подходит для сброса стилей (reset) или глобальных правил.

Когда использовать?

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

Report Page