Open In App

How to use a “not equal” CSS attribute selector ?

Improve
Improve
Like Article
Like
Save
Share
Report

 Cascading Style Sheets(CSS) fondly referred to as CSS, is a simply designed language intended to simplify the process of making web pages presentable. CSS allows you to apply styles to web pages. More importantly, CSS enables you to do this independent of the HTML that makes up each web page. CSS is easy to learn and understand, but it provides powerful control over the presentation of an HTML document.

In this article, we will learn about how to use a “not equal” CSS attribute selector.

The :not(selector) selector is used to style every element that is not specified by the selector. Since it prevents specific items from being selected, it is also known as the negation pseudo-class

Syntax:

:not(selector)
{
 CSS styles
}

Example: In this example, we have used the :not selector and paragraph element. In simple words, whatever is present in not selector, except that element, everything will change its style.

HTML




<!DOCTYPE html>
<html>
  
<head>
    <title>    CSS | :not selector    </title>
    <style>
        
        {
          color: black;
        }
          
        :not(p) 
        {
          color: green;
        }
    </style>
</head>
  
<body style="text-align:center;">
  
    <h1>GeeksforGeeks</h1>
  
      
<p>    A computer science portal for geeks.</p>
  
  
    <div>
        We provide a variety of services for you to learn,
        thrive and also have fun! Free Tutorials,
        Millions of Articles, Live, Online and Classroom Courses ,
        Frequent Coding Competitions ,Webinars by Industry Experts,
        Internship opportunities and Job Opportunities. 
        Knowledge is power!
    </div>
</body>
</html>


Output:

:not() selector



Last Updated : 06 Jun, 2022
Like Article
Save Article
Previous
Next
Share your thoughts in the comments
Similar Reads