Директива @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;
}
}