Loading
By W3Syllabus.com
Uncategorized
The CSS :not Selector is a powerful tool that allows developers to select elements that do not match a specified criteria. It is used in conjunction with the standard CSS selectors, such as class, ID, and tag selectors. By using the :not() pseudo-class, developers can easily target elements that do not meet a certain condition, rather than specifying each element individually.
For example, if a developer wants to select all paragraphs except those with the class “highlight”, they can use the following code: `p:not(.highlight) {…}`. This saves time and effort compared to selecting all paragraphs and then removing the ones with the “highlight” class one by one.
The :not selector is an essential tool in CSS for creating cleaner and more efficient stylesheets, and it can be used in a variety of ways to target specific elements and improve the design and functionality of a website.
The :not(selector) selector matches every element that is NOT the specified element/selector.
:not(selector) {
css declarations;
}
<!DOCTYPE html>
<html>
<head>
<style>
p {
color: #000000;
}
:not(p) {
color: #ff0000;
}
</style>
</head>
<body>
<h1>This is a heading</h1>
<p>This is a paragraph.</p>
<p>This is another paragraph.</p>
<div>This is some text in a div element.</div>
<a href="https://www.w3syllabus.com" target="_blank">Link to W3Syllabus!</a>
</body>
</html>
