सीएसएस कस्टम प्रॉपर्टी (वेरिएबल्स)

--name और var()

--name: value; से कस्टम प्रॉपर्टी घोषित करें और कहीं भी var(--name) से पढ़ें। ये किसी भी अन्य प्रॉपर्टी की तरह कास्केड और इनहेरिट होती हैं।

एक छोटी थीम

--brand-color को एक बार बदलें और हर संदर्भ अपने-आप अपडेट हो जाता है।

:root {
  --brand-color: #264de4;
  --spacing: 16px;
}

.button {
  background-color: var(--brand-color);
  padding: var(--spacing);
}

.link {
  color: var(--brand-color);
}

वेरिएबल की स्कोपिंग

वैश्विक वेरिएबल :root पर परिभाषित करें; किसी सेलेक्टर पर स्थानीय रूप से ओवरराइड करके सिर्फ उस सेक्शन को थीम करें — जैसे .dark-mode क्लास --bg-color को फिर से परिभाषित करे।

त्वरित जाँच: --gap नाम की सीएसएस कस्टम प्रॉपर्टी का मान कैसे पढ़ें?

• gap(--gap)
• var(--gap)
• $gap