Join James Williamson for an in-depth discussion in this video Targeting fragment identifiers, part of CSS: Selectors.
- Often instead of targeting an entire page,…a link will be used to target a specific region of the page…using what's known as a fragment identifier.…Using the target pseudo-class selector…we can give these regions unique styling…when the URL contains the targeted fragment IT.…Now if that sounds confusing, that's because…this is one selector that's actually easier to understand…by seeing it work then by describing it.…So let's take a look.…Now just to give you an example here,…you see in the first paragraph I have a link…that says site.com/resources and then #FAQ…if you've ever seen that.…
That would link to a specific region of the page.…Well what target allows us to do,…if I scroll down into the syntax you can see,…is that when an element is the target…of that URL fragment identifier,…we can style it a little bit differently,…than the other elements on the page.…Now if I scroll down in the bottom…towards this example area, you can see that…I've got three links here, for section one,…section two, and section three.…
- Targeting classes and IDs
- Working with group selectors
- Targeting element attributes
- String matching
- Targeting links with pseudo-class selectors
- Targeting child elements and empty elements
- Targeting parent, child, and sibling elements
- Matching patterns
- Writing efficient selectors
Skill Level Intermediate
CSS: Advanced Typographic Techniqueswith James Williamson3h 14m Intermediate
HTML5: Graphics and Animation with Canvaswith Joe Marini3h 7m Intermediate
1. Basic Selectors
2. Attribute Selectors
3. User Action Pseudo-Class Selectors
4. Structural Selectors
6. Matching Patterns
7. Writing Efficient 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.