@each direktivi SASS-də
Styli siyahıdakı obyektlərə tətbiq etmək üçün
@each direktivindən istifadə olunur.
Onu aşağıdakı kimi yazırlar:
@each $var (dəyişən) in (dəyərlər siyahısı)
Bu direktivin iş prinsipi ondan ibarətdir ki,
o, siyahıdakı hər bir dəyəri $var dəyişəninə
təyin edir və sonra onu hər bir stildə çıxarır.
Nümunəyə baxaq:
@each $picture in winter, spring, summer, autumn {
img .#{$picture} {
background-image: url('/images/#{$picture}.jpg');
}
}
Kompilyasiya nəticəsi:
img .spring {
background-image: url("/images/spring.jpg");
}
img .summer {
background-image: url("/images/summer.jpg");
}
img .autumn {
background-image: url("/images/autumn.jpg");
}
Aşağıdakı kodun kompilyasiya nəticəsi necə olacağını izah edin:
@each $link in menu, navbar, footer {
link .#{$link} {
color:red;
}
}