CSS :not() Pseudo-Class

Definition and Usage

CSS :not() Pseudo-classes are used to match any element that is not the specified elementselector.

Example

Example 1

Set text color for all elements that are not <p> elements:

:not(p) {
  color: red;
}

Try It Yourself

Example 2

More Examples :not() Example:

.special {
  border: 2px solid maroon;
}
p:not(.special) {
  color: green;
}
body :not(p) {
  text-decoration: underline;
}
body :not(div):not(.special) {
  font-weight: bold;
}

Try It Yourself

CSS Syntax

:not(selector) {
  css declarations;
}

Technical Details

Browser Support

The numbers in the table specify the first browser version to fully support this pseudo-class.