:not CSS Pseudo Class
Description
The :not pseudo-class sets style rules for elements that do not contain the specified selector, it is known as the negation pseudo-class.
Syntax
element:not(<selector>) { ... }
Example
<p>I am a paragraph.</p>
<p class="fancy">I am so very fancy!</p>
<div>I am NOT a paragraph.</div>.fancy {
text-shadow: 2px 2px 3px gold;
}
/* <p> elements that are not in the class '.fancy' */
p:not(.fancy) {
color: green;
}
/* Elements that are not <p> elements */
body :not(p) {
text-decoration: underline;
}
/* Elements that are not <div> and not <span> elements */
body :not(div):not(span) {
font-weight: bold;
}Browser Support
| Desktop | |||||
 |
 |
 |
 |
 |
 |
| 9 | 12 | 1 | 1 | 9.5 | 3.1 |
| Tablets / Mobile | |||||
 |
|
|
|
|
 |
| 2 | 18 | 4 | 10.1 | 2 | 1.0 |
Last updated by CSSPortal on: 25th November 2019
Share this Page
If you have enjoyed using CSSPortal, please consider sharing this page with other users, just click on your preferred social media link or copy the webpage from the link below.
URL