Using the :not() pseudo-class - CSS Tutorial

Показать описание

The :not() CSS pseudo-class allows you to select elements that do not match a specified selector or list of selectors. Essentially, you can use this to match HTML elements that "are not" something else.

This can be very useful for building user interfaces due to their desirable ability of making your code universal and re-usable - it can really help your CSS follow the DRY principal.

In this video I take you through 3 main examples of how you can use the :not() pseudo-class.

Support me on Patreon:

For your reference, check this out:

Follow me on Twitter @dcode!

If this video helped you out and you'd like to see more, make sure to leave a like and subscribe to dcode!

Рекомендации по теме

Комментарии

I love how I've come from a newer tutorial of yours to this older one. I want to acknowledge how much you've improved as a speaker. You've become so much more fluid. But even in this vido, you're very easy for me to understand!

EnterOsaka

Some tutorials get way too technical and make it hard to follow wtf they're talking about. Yours was a simple example that explains it perfectly and easy to understand. Thanks.

love--dogs

Thank you very much for this video :) It was very clear and helpful! Loved the examples!

tymothylim

thank u so much man ur the best i was making fliterable image gallery and couldnt understand a thing u r great man

ezioauditore

Great little tutorial, any chance you can do a part 2 of this. e.g. what if I had a class of "glass" how can say not bottle AND not glass classes, or even not bottle OR not glass. Thanks

harag

Using the :not() pseudo-class - CSS Tutorial

Using the :not() pseudo-class - CSS Tutorial

The :not() pseudo class in CSS - How it works

:not() CSS pseudo-class selector - 🌱 Fundamentals - CSS selectors #css #cssselectors

Pseudo Classes Explained - #12 not

The new CSS pseudo-classes explained - :is() :where() :has()

CSS :not( ) pseudo-class Selector

:not() CSS pseudo-class selector - 🚀 Exercise - CSS selectors #css #cssselectors

Do you know the difference? pseudo-classes vs pseudo-elements

MAD 2 May 2025 Project Session 5

How to use the not, last-child, and nth-chile pseudo class in css - coding weasle

Hover and not Pseudo class Using in css

Uses for the CSS :defined Pseudo-Class

CSS not() pseudo class

Hover and not Pseudo class #codewith_muhilan #css #coding

CSS is, where, and has pseudo classes

Up your CSS game with these 3 pseudo-classes that nobody use

CSS Hover And Not Pseudo Classes

JavaScript Tip: Using Pseudo-classes with querySelectorAll

The history of period products 🩸

Coding for 1 Month Versus 1 Year #shorts #coding

Learn Pseudo Class and Pseudo Elements using CSS3

How to Use the CSS :target Pseudo Class

Difference Between :empty And :blank Pseudo Selectors In CSS !

:not() Selector in CSS | :not() Pseudo Class In CSS #html #css #webdevelopment #coding #trending