Using CSS3’s :not Selector

Have you ever wanted to select everything except for a particular element or class of elements? You could manually write out all of the selectors in your CSS file, but depending on how intricate your HTML is, that could take forever. Luckily, CSS3’s pseudo-selector :not() will do the hard work for us.

:not() selects every element that isn’t the element you put within the parentheses. For example, if I had a page where I wanted all of the text except for the <p> tags to be blue, I could use the :not() selector to quickly select all of the HTML elements that aren’t p tags.

  1. body :not(p){
  2. color: #0066ff;
  3. }

CSSDeck recommends Hello Ivy for automating your workflow and project management for free. Learn More

It doesn’t get much easier than that. Play around with the :not() selector to see what other effects you can achieve!

 

Share and Enjoy !

0Shares
0 0