:not is a powerful way of selecting items that are exceptions to a given rule. In this video, use the CSS :not selector to select items that do not match a given selector.
- [Instructor] The not sudo class is super, super handy. … It's going to allow you to select things … which do not meet a certain criteria. … For example, here on this web page, … you'll notice that we have two images. … One of these images is coded correctly in the HTML … in that it has its alt tag. … But the second image does not have its alt tag. … So let's say you're debugging your site … and you need to quickly identify which of your images … does not have an alt tag. … We can write a wonderful selector to do that. … In this case we're going to say, for all of the image tags, … let's not select those that are missing. … Basically we're saying the ones that do not have … the alt attribute. … We don't need to test for a value, … we just want to test for a presence or absence … of that alt attribute. … Five pixels, solid orange border around those images. … And if we go ahead and do that, … you'll see here we have selected the one kitten picture … that is indeed missing its alt tag. …
- Targeting classes and IDs
- Working with group selectors
- Targeting element attributes
- Targeting links with pseudo-class selectors
- Targeting child elements and empty elements
- Targeting parent, child, and sibling elements
- Best practices for CSS
- The impact of CSS selectors on performance
Skill Level Beginner
The power of selectors1m 8s
1. Review of Basic CSS
2. Combinator Selectors
3. Attribute Selectors
Simple attribute selectors2m 47s
4. Pseudo-Classes, Pseudo-Elements, and the Universal Selector
5. Choosing Selectors
- Mark as unwatched
- Mark all as unwatched
Are you sure you want to mark all the videos in this course as unwatched?
This will not affect your course history, your reports, or your certificates of completion for this course.Cancel
Take notes with your new membership!
Type in the entry box, then click Enter to save your note.
1:30Press on any video thumbnail to jump immediately to the timecode shown.
Notes are saved with you account but can also be exported as plain text, MS Word, PDF, Google Doc, or Evernote.