Direktiva @each v SASS
Pro aplikování stylu
na seznam objektů se používá
direktiva @each. Zapisuje se
následovně:
@each $var (proměnná) in (seznam hodnot)
Podstata činnosti této direktivy spočívá v tom,
že nastaví pro každou hodnotu
ze seznamu proměnnou $var,
a poté ji vypíše v každém stylu.
Podívejme se na příklad:
@each $picture in winter, spring, summer, autumn {
img .#{$picture} {
background-image: url('/images/#{$picture}.jpg');
}
}
Výsledek kompilace:
img .spring {
background-image: url("/images/spring.jpg");
}
img .summer {
background-image: url("/images/summer.jpg");
}
img .autumn {
background-image: url("/images/autumn.jpg");
}
Vysvětlete, jaký bude výsledek kompilace následujícího kódu:
@each $link in menu, navbar, footer {
link .#{$link} {
color:red;
}
}