@each direktiiv SASS-is
Selleks, et rakendada stiili
objektide loetelule, kasutatakse
directiivi @each. See kirjutatakse
järgnevalt:
@each $var (muutuja) in (väärtuste loetelu)
Selle direktiivi töö põhiolemus on selles, et
see määrab igale väärtusele
loetelust muutuja $var,
ning seejärel kuvab selle igas stiilis.
Vaatame näidet:
@each $picture in winter, spring, summer, autumn {
img .#{$picture} {
background-image: url('/images/#{$picture}.jpg');
}
}
Kompileerimise tulemus:
img .spring {
background-image: url("/images/spring.jpg");
}
img .summer {
background-image: url("/images/summer.jpg");
}
img .autumn {
background-image: url("/images/autumn.jpg");
}
Kirjelda, milline on järgneva koodi kompileerimise tulemus:
@each $link in menu, navbar, footer {
link .#{$link} {
color:red;
}
}