Директива @each у SASS-у
Да би се стил применио
на листу објеката користи се
директива @each. Она се записује
на следећи начин:
@each $var (променљива) in (списак вредности)
Суштина рада ове директиву је у томе што
она поставља у сваку вредност
из списка променљиву $var,
а затим је приказује у сваком стилу.
Погледајмо пример:
@each $picture in winter, spring, summer, autumn {
img .#{$picture} {
background-image: url('/images/#{$picture}.jpg');
}
}
Резултат компајлирања:
img .spring {
background-image: url("/images/spring.jpg");
}
img .summer {
background-image: url("/images/summer.jpg");
}
img .autumn {
background-image: url("/images/autumn.jpg");
}
Реците, какав ће бити резултат компајлирања следећег кода:
@each $link in menu, navbar, footer {
link .#{$link} {
color:red;
}
}