स्पेसिंग करना
बूटस्ट्रैप च इक तत्व दी शक्ल गी संशोधित करने आस्तै शॉर्टहैंड रिस्पांसिव मार्जिन ते पैडिंग यूटिलिटी क्लासें दी इक विस्तृत श्रृंखला शामल ऐ।
आशुलिपि वर्गें कन्नै इक तत्व जां उसदे पक्षें दे इक उप-समूह गी प्रतिक्रियाशील-अनुकूल marginजां मूल्यें गी असाइन करो। paddingव्यक्तिगत गुणें, सारे गुणें, ते ऊर्ध्वाधर ते क्षैतिज गुणें लेई समर्थन शामल ऐ। क्लासें गी इक डिफ़ॉल्ट सस मैप थमां बनाया जंदा ऐ जेह् .25remड़ा 3rem.
स्पेसिंग उपयोगिताएं गी जेह् ड़ियां सारे ब्रेकपॉइंटें पर लागू होंदियां न, थमां xsलेइयै xl, उंदे च कोई ब्रेकपॉइंट संक्षिप्त रूप नेईं ऐ। इसदा कारण ऐ जे ओह् वर्गें गी थमां min-width: 0ते उप्पर लागू कीता जंदा ऐ , ते इस चाल्लीं मीडिया क्वेरी कन्नै बाध्य नेईं ऐ । बाकी ब्रेकपॉइंटें च, हालांकि, इक ब्रेकपॉइंट संक्षिप्त रूप बी शामल ऐ।
क्लासें दा नांऽ , , , ते {property}{sides}-{size}आस्तै xsते {property}{sides}-{breakpoint}-{size}आस्तै फार्मेट दा इस्तेमाल करियै कीता जंदा ऐ .smmdlgxl
जित्थें संपत्ति इक ऐ:
m- सेट करने आली क्लासें लेईmarginp- सेट करने आली क्लासें लेईpadding
जित्थें पक्षें च इक ऐ:
t- कक्षाएं लेई जेह् ड़ी सेट कीती जंदी ऐmargin-topजांpadding-topb- कक्षाएं लेई जेह् ड़ी सेट कीती जंदी ऐmargin-bottomजांpadding-bottoml- कक्षाएं लेई जेह् ड़ी सेट कीती जंदी ऐmargin-leftजांpadding-leftr- कक्षाएं लेई जेह् ड़ी सेट कीती जंदी ऐmargin-rightजांpadding-rightx- कक्षाएं लेई जेह् ड़ियां दौंनें गी सेट करदियां न*-leftते*-righty- कक्षाएं लेई जेह् ड़ियां दौंनें गी सेट करदियां न*-topते*-bottom- रिक्त - उनें वर्गें आस्तै जेह् ड़ियां इक
marginजांpaddingतत्व दे सारे 4 पास्सें पर सेट करदियां न
जित्थें आकार इक ऐ:
0- उनें कक्षाएं आस्तै जेह् ड़ियांmarginजांpaddingइसगी सेट करियै खत्म करदियां न01- (डिफ़ॉल्ट रूप कन्नै) उनें वर्गें लेई जेह् ड़ियांmarginजांpaddingगी सेट करदियां न$spacer * .252- (डिफ़ॉल्ट रूप कन्नै) उनें वर्गें लेई जेह् ड़ियांmarginजांpaddingगी सेट करदियां न$spacer * .53- (डिफ़ॉल्ट रूप कन्नै) उनें वर्गें लेई जेह् ड़ियांmarginजांpaddingगी सेट करदियां न$spacer4- (डिफ़ॉल्ट रूप कन्नै) उनें वर्गें लेई जेह् ड़ियांmarginजांpaddingगी सेट करदियां न$spacer * 1.55- (डिफ़ॉल्ट रूप कन्नै) उनें वर्गें लेई जेह् ड़ियांmarginजांpaddingगी सेट करदियां न$spacer * 3auto- कक्षाएं लेई जेह् ड़ियांmarginऑटो गी सेट करदियां न
$spacers(तुस सस्स मैप चर च प्रविश्टियां जोड़ियै होर आकार जोड़ सकदे ओ ।)
इनें वर्गें दे किश प्रतिनिधि उदाहरण दित्ते गेदे न:
.mt-0 {
margin-top: 0 !important;
}
.ml-1 {
margin-left: ($spacer * .25) !important;
}
.px-2 {
padding-left: ($spacer * .5) !important;
padding-right: ($spacer * .5) !important;
}
.p-3 {
padding: $spacer !important;
}इसदे अलावा, बूटस्ट्रैप च क्षैतिज मार्जिन गी सेट करियै .mx-autoस्थिर-चौड़ाई ब्लॉक स्तर सामग्री गी क्षैतिज रूप कन्नै केंद्रत करने आस्तै इक वर्ग बी शामल ऐ- यानी सामग्री जेह् ड़ी ऐ display: blockते इक widthसेट ऐ- क्षैतिज मार्जिन गी सेट करियै auto.
<div class="mx-auto" style="width: 200px;">
Centered element
</div>