Join James Williamson for an in-depth discussion in this video String matching, part of CSS: Selectors.
- We'll close out our chapter on attribute selectors…by looking at variations of the syntax…that allow us to match string values inside the attributes.…These capabilities make attribute selectors…extremely flexible and a really powerful styling tools.…I'm gonna scroll down a little bit…so that we can see the actual syntax…that I'm talking about here.…So the very first one is matching a prefix.…For this we have the caret character appear before the =.…
What this allows us to do is it allows us to match a string…that comes at the very beginning of the attribute value.…Now the example I've used here is a very common one,…it has the http protocol with the ://.…That allows us to match any external link…or anything using this specific protocol.…So the caret basically says this exact string value…will appear at the beginning of the attribute value.…Now we also can match a suffix.…You can see down below that we have a $ in front of the =…and when you have that you're basically saying…that the following string is matched…
- 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.