Learn more about the CSS3 NOT selector


To coincide with our new Jump Start book series, Learnable and SitePoint have produced a series of JumpCasts — bite-sized video tutorials covering a range of dev and design topics. If you like what you see here, there are plenty more over at our sister site, Learnable.com.

To start off, join Russ Weakley from Max Design as he presents a Learnable JumpCast on a new CSS3 selector called the “not” selector.

The interesting thing about the “not” selector is that it’s the opposite of almost every other selector you’ve used. In most cases, you’re aiming to style something very specific: “I want to style that element” or “that subset of elements”. With the not selector, you’re doing the opposite. Instead of styling one element, you’re saying, “I want to style everything but that element”. We’re doing the opposite of most other selectors. Head over to Learnable to find out more …

Free book: Jump Start HTML5 Basics

Grab a free copy of one our latest ebooks! Packed with hints and tips on HTML5's most powerful new features.

  • http://www.linkedin.com/in/ernstjansen Ernst Jansen

    Thanks a lot for sharing this JumpCast, I’ve learned something today since I .did:NOT(#know) { it:existed; }

    • http://niteodesign.com Blake Petersen

      lol, funny stuff

  • http://www.codeconquest.com Charles @ CodeConquest.com

    I am so glad this selector exists. It’s something I’ve needed quite a bit.

    One question though: is it possible to select elements or class names? (example: h1:not or .classname:not)

  • http://maxdesign.com.au/ Russ Weakley

    @Charles, yes! you can use any selector before the :not() selector – including elements, classes, ids etc. The only restrictions are on what can be placed inside the brackets.

  • http://www.andrecolon.110mb.com Dre

    Great stuff, Easy voice to follow and comprehensive.