Direktiva @each në SASS
Për të aplikuar një stil
në një listë objektesh përdoret
direktiva @each. Ajo shkruhet
në mënyrën e mëposhtme:
@each $var (ndryshore) in (listë vlerash)
Thelbi i punës së kësaj direktive është se
ajo vendos në secilën vlerë
nga lista ndryshoren $var,
dhe pastaj e nxjerr atë në çdo stil.
Le të shqyrtojmë një shembull:
@each $picture in winter, spring, summer, autumn {
img .#{$picture} {
background-image: url('/images/#{$picture}.jpg');
}
}
Rezultati i kompilimit:
img .spring {
background-image: url("/images/spring.jpg");
}
img .summer {
background-image: url("/images/summer.jpg");
}
img .autumn {
background-image: url("/images/autumn.jpg");
}
Tregoni, si do të jetë rezultati i kompilimit të kodit në vijim:
@each $link in menu, navbar, footer {
link .#{$link} {
color:red;
}
}