सीएसएस चर ऐ

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

साढ़े सारे कस्टम गुणें गीbs- त्रीयें पार्टी CSS कन्नै टकराव थमां बचने आस्तै उपसर्ग कीता गेदा ऐ।

जड़ चर

इत्थै उनें चर न जेह् ड़े अस शामल करदे आं (ध्यान देओ जे :rootजरूरी ऐ ) जेह् ड़े कुतै बी बूटस्ट्रैप दा सीएसएस लोड होंदा ऐ , एक्सेस कीता जाई सकदा ऐ । एह् साढ़ी फाइल च स्थित न _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 गी घट्ट करी सकने आं, एह् सुनिश्चत करी सकने आं जे नेस्टेड टेबल जनेह् थाह् रें पर शैलियां विरासत च नेईं मिलदियां न, ते Sass संकलन दे बाद बूटस्ट्रैप घटकें गी किश बुनियादी रिस्टाइलिंग ते विस्तार करने दी अनुमति देई सकने आं.

अस किस चाल्ली CSS चर दा इस्तेमाल करा करदे आं इसदे बारे च किश अंतर्दृष्टि आस्तै साढ़ी तालिका दस्तावेजीकरण पर इक नज़र पाओ .

अस अपने ग्रिड दे पूरे-पराते CSS चर दा बी इस्तेमाल करा करदे आं-मुख्य रूप कन्नै गटरें आस्तै-भविक्ख च होर घटकें दा इस्तेमाल होने कन्नै।

उदाहरण दे

CSS चर Sass दे चर दे समान लचीलापन प्रदान करदे न, पर ब्राउज़र गी परोसने शा पैह् ले संकलन दी लोड़ दे बगैर। मसाल आस्तै, इत्थै अस अपने पेज दे फॉन्ट ते लिंक शैलियें गी CSS चर कन्नै रिसेट करा करदे आं।

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