विषयसूची:

मैं सामग्री को बूटस्ट्रैप में कैसे केन्द्रित करूं?
मैं सामग्री को बूटस्ट्रैप में कैसे केन्द्रित करूं?

वीडियो: मैं सामग्री को बूटस्ट्रैप में कैसे केन्द्रित करूं?

वीडियो: मैं सामग्री को बूटस्ट्रैप में कैसे केन्द्रित करूं?
वीडियो: How to create a Responsive navbar in Bootstrap 2024, नवंबर
Anonim

बूटस्ट्रैप 4

डी-फ्लेक्स जस्टिफाई का प्रयोग करें- विषय - केंद्र आपके कॉलम div पर। यह करेगा केंद्र उस कॉलम के अंदर सब कुछ। यदि आपके पास है मूलपाठ कॉलम के अंदर, और आप वह सब संरेखित करना चाहते हैं केंद्र . बस जोड़ दो मूलपाठ - केंद्र एक ही वर्ग को।

यह भी जानिए, मैं बूटस्ट्रैप कार्ड को कैसे केन्द्रित करूं?

अतिरिक्त CSS की कोई आवश्यकता नहीं है, और बूटस्ट्रैप 4 में कई केंद्रित विधियाँ हैं:

  1. केंद्र प्रदर्शन के लिए पाठ केंद्र: इनलाइन तत्व।
  2. प्रदर्शन को केंद्रित करने के लिए एमएक्स-ऑटो: डिस्प्ले के अंदर ब्लॉक तत्व: फ्लेक्स (डी-फ्लेक्स)
  3. ऑफसेट-* या एमएक्स-ऑटो का उपयोग ग्रिड कॉलम को केंद्र में करने के लिए किया जा सकता है।
  4. या जस्टिफाई-कंटेंट-सेंटर ऑन रो टू सेंटर ग्रिड कॉलम।

इसी तरह, मैं बूटस्ट्रैप में किसी छवि को कैसे केंद्रित करूं? संरेखित इमेजिस हेल्पर फ्लोट क्लासेस या टेक्स्ट अलाइनमेंट क्लासेस के साथ। ब्लॉक-स्तर इमेजिस का उपयोग करके केन्द्रित किया जा सकता है। एमएक्स-ऑटो मार्जिन उपयोगिता वर्ग।

बस इतना ही, मैं बूटस्ट्रैप 4 में सामग्री को कैसे केन्द्रित करूं?

बूटस्ट्रैप 4 में कई क्षैतिज केंद्र विधियाँ हैं

  1. केंद्र प्रदर्शन के लिए पाठ केंद्र: इनलाइन तत्व।
  2. ऑफसेट-* या एमएक्स-ऑटो का उपयोग कॉलम को केंद्र में करने के लिए किया जा सकता है (कॉल-*)
  3. या, औचित्य-सामग्री-केंद्र पंक्ति से केंद्र स्तंभों पर (कॉल-*)
  4. प्रदर्शन को केंद्रित करने के लिए एमएक्स-ऑटो: डी-फ्लेक्स के अंदर तत्वों को ब्लॉक करें।

आप CSS में कार्ड को कैसे केन्द्रित करते हैं?

सीएसएस स्तर 3 में लंबवत रूप से केंद्रित करना

  1. कंटेनर को अपेक्षाकृत स्थित बनाएं, जो इसे पूरी तरह से स्थित तत्वों के लिए एक कंटेनर घोषित करता है।
  2. तत्व को स्वयं बिल्कुल स्थित बनाएं।
  3. इसे आधा नीचे कंटेनर में 'टॉप: 50%' के साथ रखें।
  4. तत्व को उसकी आधी ऊंचाई तक ऊपर ले जाने के लिए अनुवाद का उपयोग करें।

सिफारिश की: