Join Ray Villalobos for an in-depth discussion in this video Creating list elements, part of Sass Essential Training.
- In many programming languages,…we can create lists of elements,…which are usually known as arrays.…So Sass has a special version of arrays called lists.…And they're really unlike any other…type of array structure.…Now, believe it or not, you've already used lists,…and that's because they're based on the way…you use CSS.…So if we take a look at this variable.scss file,…you'll notice that we're using a couple of fonts…right here, and technically these…will become lists of elements.…
In Sass, lists are just how Sass represents…the values in CSS delcarations.…Lists are separated either by commas, or spaces.…And Sass isn't at all strict about how it uses data types.…For example, you don't always need to use quotations,…unless you're using a special character.…So right here, because we have a space in this font name,…we have to use quotations.…But up here where Merriweather is just a simple font name,…we don't really need to have the quotations around that.…
Now, you can create lists either with spaces…or commas when they make sense in CSS.…
- 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.