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

:not()

Выбирает элементы, которые не подходят ни под один из селекторов в скобках.

Синтаксис

selector:not(list) { … }

Параметры

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

Примеры

Разделитель у всех пунктов, кроме последнего; жирные — невыполненные дела:

<style>
  li:not(:last-child) { margin-bottom: 8px; border-bottom: 1px dashed gray; }
  li:not(.done) { font-weight: bold; }
</style>
 
<ul>
  <li class="done">Buy bread</li>
  <li>Call Anna</li>
  <li>Pay $25 rent</li>
</ul>

Примечания

Специфичность :not() равна специфичности самого сильного селектора внутри. Голый :not(.x) без тега подходит и <html>, и <body>, поэтому ставьте перед ним тег или класс.

См. также

:is() — Срабатывает, если элемент подходит под любой селектор из списка, — способ сократить длинные списки селекторов.
:has() — Выбирает элемент, внутри которого есть что-то подходящее под селектор в скобках, — «селектор родителя».
:last-child — Срабатывает у элемента, который стоит последним среди детей своего родителя.

В учебнике

Псевдоклассы — Стили для состояний и положения элементов — hover, focus, ссылки, first-child, nth-child, not и поля форм.

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