Directiva @each în SASS
Pentru a aplica un stil
unei liste de obiecte se folosește
directiva @each. Aceasta se scrie
în felul următor:
@each $var (variabilă) in (lista de valori)
Esența funcționării acestei directive este că
ea stabilește pentru fiecare valoare
din listă variabila $var,
apoi o afișează în fiecare stil.
Să luăm un exemplu:
@each $picture in winter, spring, summer, autumn {
img .#{$picture} {
background-image: url('/images/#{$picture}.jpg');
}
}
Rezultatul compilării:
img .spring {
background-image: url("/images/spring.jpg");
}
img .summer {
background-image: url("/images/summer.jpg");
}
img .autumn {
background-image: url("/images/autumn.jpg");
}
Spuneți, care va fi rezultatul compilării următorului cod:
@each $link in menu, navbar, footer {
link .#{$link} {
color:red;
}
}
