- Elements that don’t match a list of selectors are represented by the:not() CSS pseudo-class.
- It is referred to as the negation pseudo-class since it stops users from selecting particular options.
- Syntax: :not(<complex-selector-list>)
- :not(.foo) will match anything that isn’t .foo, including and <HTML> and <body>
- The most specific selector in its comma-separated list of selectors replaces the specificity of the:not() pseudo-class, giving it the same specificity as if it had been written:not(:is(argument))).
- If any selector passed to the :not() pseudo-class is invalid or not supported by the browser, the whole rule will be invalidated. The effective way to overcome this behavior is to use :is pseudo-class, which accepts a forgiving selector list. For example :not(.foo, :invalid-pseudo-class) will invalidate a whole rule, but :is(:not(.foo), :not(:invalid-pseudo-class)) will match any element that isn’t .foo.
CSS Pseudo element :not()
