SASS में वेरिएबल्स और कंटेंट ब्लॉक्स की स्कोप
मिक्सिन में कंटेंट ब्लॉक्स पास करते समय, उनकी स्कोप ब्लॉक की विशिष्ट लोकेशन द्वारा निर्धारित की जाती है, मिक्सिन द्वारा नहीं। इसलिए, हम पास किए गए कंटेंट ब्लॉक में मिक्सिन के लोकल वेरिएबल्स का उपयोग नहीं कर सकते, जो केवल ग्लोबल वेरिएबल्स के साथ काम करने में सक्षम होगा।
निम्नलिखित उदाहरण पर विचार करें:
$size: 14px;
@mixin sizes ($size: 20px) {
font-size: $size;
padding: $size;
@content;
}
.navbar {
@include sizes {
margin: $size;
}
}
कंपाइलेशन का परिणाम:
.navbar {
font-size: 20px;
padding: 20px;
margin: 14px;
}
बताएं कि निम्नलिखित कोड की कंपाइलेशन का परिणाम क्या होगा:
$color: yellow;
@mixin links ($color: red) {
background: $color;
@content;
}
बताएं कि निम्नलिखित कोड की कंपाइलेशन का परिणाम क्या होगा:
$color: yellow;
$size: 10px;
@mixin links ($color: red, $size: 12px) {
background-color: $color;
font-size: $size;
@content;
}
.navbar {
@include links {
box-shadow: $color;
padding: $size;
}
}
बताएं कि निम्नलिखित कोड की कंपाइलेशन का परिणाम क्या होगा:
$color: green;
$size: 6px;
@mixin links ($color: red, $size: 10px) {
color: $color;
font-size: $size;
@content;
}
.navbar {
@include links {
border-color: $color;
margin: $size;
}
}
#active{
@include links{
background-color: $color;
padding-top: $size;
padding-bottom: $size * 2;
}
}