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

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


Псевдокласс :is() – это мощный инструмент, который упрощает написание сложных CSS-селекторов и повышает читаемость кода.

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

:is() принимает список селекторов и применяет одно и то же правило к любому из них. Это позволяет избежать повторения кода.

Пример:

css
:is(h1, h2, h3) {
  color: #4A90E2;
  font-weight: bold;
}

В этом примере стиль применяется ко всем заголовкам h1, h2 и h3, не требуя написания отдельных правил для каждого.

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

  • Читаемость: Код становится короче и понятнее.
  • Поддержка: Современные браузеры уже хорошо поддерживают :is().

Важно:

:is() влияет на специфичность. Он берёт на себя наибольшую специфичность из всех селекторов внутри. Например, если в :is() указан селектор с классом и селектор с тегом, специфичность будет соответствовать селектору с классом.



Report Page