सीएसएस चर

बूटस्ट्रैप अपनऽ संकलित सीएसएस म॑ लगभग दू दर्जन सीएसएस कस्टम गुण (चर) शामिल करै छै, जेकरा म॑ दर्जनों आरू प्रति-घटक आधार प॑ बेहतर अनुकूलन के रास्ता प॑ छै । इ अहां कें ब्राउज़र कें इंस्पेक्टर, कोड सैंडबॉक्स, या सामान्य प्रोटोटाइपिंग मे काज करय कें समय हमर थीम रंग, ब्रेकपॉइंट, आ प्राथमिक फॉन्ट स्टैक जैना आमतौर पर उपयोग कैल जाय वाला मानक कें आसान पहुंच प्रदान करय छै.

हमरऽ सब कस्टम गुणऽ के उपसर्ग के साथbs- छै ताकि तृतीय पक्ष सीएसएस के साथ टकराव स॑ बचलऽ जाय सक॑ ।

मूल चर

एतय हम शामिल चर अछि (ध्यान राखू जे :rootआवश्यक अछि) जे कतहु बूटस्ट्रैप के CSS लोड कएल गेल अछि तक पहुँचल जा सकैत अछि | ई सब हमर फाइल मे स्थित अछि _root.scssआ हमर संकलित dist फाइल मे शामिल अछि |

:root {
  --bs-blue: #0d6efd;
  --bs-indigo: #6610f2;
  --bs-purple: #6f42c1;
  --bs-pink: #d63384;
  --bs-red: #dc3545;
  --bs-orange: #fd7e14;
  --bs-yellow: #ffc107;
  --bs-green: #198754;
  --bs-teal: #20c997;
  --bs-cyan: #0dcaf0;
  --bs-white: #fff;
  --bs-gray: #6c757d;
  --bs-gray-dark: #343a40;
  --bs-primary: #0d6efd;
  --bs-secondary: #6c757d;
  --bs-success: #198754;
  --bs-info: #0dcaf0;
  --bs-warning: #ffc107;
  --bs-danger: #dc3545;
  --bs-light: #f8f9fa;
  --bs-dark: #212529;
  --bs-font-sans-serif: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", "Liberation Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
  --bs-font-monospace: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
  --bs-gradient: linear-gradient(180deg, rgba(255, 255, 255, 0.15), rgba(255, 255, 255, 0));
}

घटक चर

हम विभिन्न घटक के लेल स्थानीय चर के रूप में कस्टम गुण के उपयोग सेहो करब शुरू क रहल छी | एहि तरहें हम अपन संकलित सीएसएस कें कम कयर सकय छी, सुनिश्चित करय सकय छी जे नेस्टेड टेबल जैना जगहक पर शैली विरासत मे नहि मिलय छै, आ सास संकलन कें बाद बूटस्ट्रैप घटक कें किछु बेसिक रिस्टाइलिंग आ विस्तार करय कें अनुमति द सकय छी.

हम CSS चर के उपयोग कोना क रहल छी ताहि पर किछु अंतर्दृष्टि के लेल हमर टेबल डॉक्यूमेंटेशन पर एक बेर देखू .

हम अपनऽ ग्रिड भर म॑ CSS चर के उपयोग भी करी रहलऽ छियै-मुख्य रूप स॑ गटर लेली-भविष्य म॑ अधिक घटक उपयोग के साथ ।

उदाहरण के लिये

CSS चर Sass केरऽ चर के समान लचीलापन प्रदान करै छै, लेकिन ब्राउज़र क॑ परोसै स॑ पहल॑ संकलन के जरूरत के बिना । जेना कि यहाँ हम अपनऽ पेज केरऽ फॉन्ट आरू लिंक स्टाइल क॑ CSS वैरिएबल स॑ रीसेट करी रहलऽ छियै ।

body {
  font: 1rem/1.5 var(--bs-font-sans-serif);
}
a {
  color: var(--bs-blue);
}