Sass Tutorials #9 - Nth Function In Lists

Опубликовано: 01 Март 2012
на канале: Syntax
23,878
108

This is the 2nd tutorial in a series that show users how to code CSS using advanced features in Sass.

This tutorial covers the use of the Nth function to find values in lists. This example goes over the basics of Nth and then uses an @each statement to build gradually lighten a back background over 4 separate divs.

The code:
@each $p in (
one black,
two black + 20,
three black + 40,
four black + 60
) {
.#{nth($p,1)} { background:#{nth($p,2)}; }
}