Join Ray Villalobos for an in-depth discussion in this video Nesting your styles, part of Sass Essential Training.
- Another really popular Sass feature is called nesting.…It allows you to put CSS rules inside other rules…and it's a great way to organize your styles…so that they're super easy to find.…I have a section right here called Media.…It has sort of a typical sort of media style…that you would use on a website.…It's essentially a list, right now it's an ordered list…that's why these numbers appear right here.…Inside each one of those list items,…you can see a photo, a headline and some text.…
Everything is wrapped around an anchor tag.…Let's go ahead and open up the index.html file…so you could see what I'm talking about.…This is the media class…which is assigned to this ordered list.…Then we have this item class…which is assigned to the list items.…Then we have this anchor tag right here…as well as photo headline in paragraph.…The headline has a class of head.…Let's go ahead and work on how we would use nesting…and keep it all organized in a single place.…
Right here, I'm going to target a new media class…and I'm going to clear out the margins…
- Working with variables
- Nesting styles
- Creating mixins
- Conditional statements and loops in SassScript
- Extending your mixins
- Working with lists and maps
Skill Level Intermediate
CSS: Advanced Typographic Techniqueswith James Williamson3h 14m Intermediate
1. Getting Started
2. Learning Sass Fundamentals
3. Working with SassScript
Next steps1m 21s
- 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.