SASS में सिलेक्टर्स के अंदर ग्लोबल वेरिएबल्स

यदि हम वेरिएबल्स को सिलेक्टर्स के अंदर परिभाषित करते हैं, तो हम उन्हें केवल परिभाषित नेस्टिंग स्तर की सीमाओं के भीतर ही उपयोग कर सकेंगे। हालाँकि, यदि हम चाहते हैं कि वेरिएबल वैश्विक रूप से उपलब्ध हो, तो हम इसके मान के साथ !global टैग जोड़ते हैं। आइए एक उदाहरण देखें:

styles.scssdiv {
  $height: 20px !global;
  height: $height;
}
#navbar {
  height: $height;
}

दिए गए कोड का कंपाइलेशन परिणाम निम्नलिखित होगा:

styles.cssdiv {
  height: 20px; 
}
#navbar {
  height: 20px; 
}

styles.scss#main {
  $font-family: Arial !global;
  font-family: $font-family;
}
#navbar {
  font-family: $font-family;
}