SASS में @each डायरेक्टिव
स्टाइल को ऑब्जेक्ट्स की सूची पर लागू करने के लिए
@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;
}
}