मीडिया वस्तु
ब्लॉग टिप्पणी, ट्वीट, आ ऐहन तरह कें अत्यधिक दोहराएय वाला घटक कें निर्माण करय कें लेल बूटस्ट्रैप कें मीडिया ऑब्जेक्ट कें लेल दस्तावेजीकरण आ उदाहरण.
मीडिया ऑब्जेक्ट जटिल आरू दोहराबै वाला घटक के निर्माण म॑ मदद करै छै, जहां कुछ मीडिया क॑ सामग्री के साथ-साथ स्थिति म॑ रखलऽ जाय छै जे उक्त मीडिया के चारो तरफ नै लपेटै छै । संगहि, ई फ्लेक्सबॉक्स के बदौलत मात्र दू टा आवश्यक क्लास के संग ई काज करैत अछि.
नीचाँ एकटा मीडिया वस्तुक उदाहरण देल गेल अछि । मात्र दू टा क्लासक आवश्यकता अछि-लपेटब .media
आ .media-body
अहाँक सामग्रीक चारू कात। वैकल्पिक पैडिंग आ मार्जिन कें स्पेसिंग यूटिलिटीज कें माध्यम सं नियंत्रित कैल जा सकय छै .
मीडिया हेडिंग
क्रास बैस अमेट निभ लिबेरो, ग्रेविडा नुल्ला में। नुल्ला वेल मेटस स्केलेरिस्क एंटी सोलिसिट्यूडिन। क्रास पुरुस ओडियो, वेस्टिबुलम में वल्पुटेट एट, टेम्पस विवेरा टर्पिस | Fusce condimentum nunc एसी निसी वल्पुटेट फ्रिंगिला। फौसिबस में डोनेक लैसिनिया कोंगे फेलिस।फ्लेक्सबग #12: इनलाइन तत्वक कें फ्लेक्स आइटम कें रूप मे नहि मानल जायत छै
इंटरनेट एक्सप्लोरर 10-11 लिंक या छवि (या ::before
आरू ::after
छद्म-तत्व) जैसनऽ इनलाइन तत्व क॑ फ्लेक्स आइटम के रूप म॑ रेंडर नै करै छै. एकमात्र समाधान एकटा गैर-इनलाइन display
मान (जैना, block
, inline-block
, या flex
) सेट करब अछि । हम सुझाव दैत छी जे .d-flex
, हमर प्रदर्शन उपयोगिता मे स एकटा , एकटा आसान फिक्स क रूप मे उपयोग करू.
स्रोत: गिटहब पर फ्लेक्सबग्स
मीडिया ऑब्जेक्ट असीम रूप सं नेस्ट कएल जा सकैत अछि, हालांकि हम सुझाव दैत छी जे कोनो समय रुकि जाउ. एकटा मूल मीडिया ऑब्जेक्ट क' .media
भीतर नेस्टेड राखू ..media-body
मीडिया हेडिंग
क्रास बैस अमेट निभ लिबेरो, ग्रेविडा नुल्ला में। नुल्ला वेल मेटस स्केलेरिस्क एंटी सोलिसिट्यूडिन। क्रास पुरुस ओडियो, वेस्टिबुलम में वल्पुटेट एट, टेम्पस विवेरा टर्पिस | Fusce condimentum nunc एसी निसी वल्पुटेट फ्रिंगिला। फौसिबस में डोनेक लैसिनिया कोंगे फेलिस।मीडिया ऑब्जेक्ट मे मीडिया कें flexbox उपयोगिता कें साथ अहां कें .media-body
सामग्री कें ऊपर (डिफ़ॉल्ट), बीच, या अंत मे संरेखित कैल जा सकय छै.
शीर्ष संरेखित मीडिया
क्रास बैस अमेट निभ लिबेरो, ग्रेविडा नुल्ला में। नुल्ला वेल मेटस स्केलेरिस्क एंटी सोलिसिट्यूडिन। क्रास पुरुस ओडियो, वेस्टिबुलम में वल्पुटेट एट, टेम्पस विवेरा टर्पिस | Fusce condimentum nunc एसी निसी वल्पुटेट फ्रिंगिला। फौसिबस में डोनेक लैसिनिया कोंगे फेलिस।
डोनेक सेद ओडियो दुई। Nullam quis risus eget उर्ना मोलिस ornare वेल ईउ लियो | सह sociis natoque penatibus एट मैग्निस डिस parturient montes, nascetur रिडिकुलस मुस।
केंद्र संरेखित मीडिया
क्रास बैस अमेट निभ लिबेरो, ग्रेविडा नुल्ला में। नुल्ला वेल मेटस स्केलेरिस्क एंटी सोलिसिट्यूडिन। क्रास पुरुस ओडियो, वेस्टिबुलम में वल्पुटेट एट, टेम्पस विवेरा टर्पिस | Fusce condimentum nunc एसी निसी वल्पुटेट फ्रिंगिला। फौसिबस में डोनेक लैसिनिया कोंगे फेलिस।
डोनेक सेद ओडियो दुई। Nullam quis risus eget उर्ना मोलिस ornare वेल ईउ लियो | सह sociis natoque penatibus एट मैग्निस डिस parturient montes, nascetur रिडिकुलस मुस।
निचला संरेखित मीडिया
क्रास बैस अमेट निभ लिबेरो, ग्रेविडा नुल्ला में। नुल्ला वेल मेटस स्केलेरिस्क एंटी सोलिसिट्यूडिन। क्रास पुरुस ओडियो, वेस्टिबुलम में वल्पुटेट एट, टेम्पस विवेरा टर्पिस | Fusce condimentum nunc एसी निसी वल्पुटेट फ्रिंगिला। फौसिबस में डोनेक लैसिनिया कोंगे फेलिस।
डोनेक सेद ओडियो दुई। Nullam quis risus eget उर्ना मोलिस ornare वेल ईउ लियो | सह sociis natoque penatibus एट मैग्निस डिस parturient montes, nascetur रिडिकुलस मुस।
एचटीएमएल क॑ ही संशोधित करी क॑ मीडिया ऑब्जेक्ट म॑ सामग्री केरऽ क्रम बदलै छै, या गुण क॑ सेट करै लेली कुछ कस्टम फ्लेक्सबॉक्स सीएसएस जोड़ै क॑ order
(अपनऽ पसंद केरऽ पूर्णांक म॑) ।
मीडिया वस्तु
क्रास बैस अमेट निभ लिबेरो, ग्रेविडा नुल्ला में। नुल्ला वेल मेटस स्केलेरिस्क एंटी सोलिसिट्यूडिन। क्रास पुरुस ओडियो, वेस्टिबुलम में वल्पुटेट एट, टेम्पस विवेरा टर्पिस | Fusce condimentum nunc एसी निसी वल्पुटेट फ्रिंगिला। फौसिबस में डोनेक लैसिनिया कोंगे फेलिस।चूँकि मीडिया ऑब्जेक्ट म॑ एतना कम संरचनात्मक आवश्यकता छै, आप सूची एचटीएमएल तत्वऽ प॑ भी ई वर्गऽ के उपयोग करी सकै छियै । अपन <ul>
या पर, कोनो ब्राउज़र डिफ़ॉल्ट सूची शैली हटाबय लेल <ol>
जोड़ू , आओर फेर अपन s पर लागू करू. हमेशा के तरह, फाइन ट्यून करय लेल जतय जरूरत होए स्पेसिंग यूटिलिटी के उपयोग करू..list-unstyled
.media
<li>
-
सूची आधारित मीडिया वस्तु
क्रास बैस अमेट निभ लिबेरो, ग्रेविडा नुल्ला में। नुल्ला वेल मेटस स्केलेरिस्क एंटी सोलिसिट्यूडिन। क्रास पुरुस ओडियो, वेस्टिबुलम में वल्पुटेट एट, टेम्पस विवेरा टर्पिस | Fusce condimentum nunc एसी निसी वल्पुटेट फ्रिंगिला। फौसिबस में डोनेक लैसिनिया कोंगे फेलिस। -
सूची आधारित मीडिया वस्तु
क्रास बैस अमेट निभ लिबेरो, ग्रेविडा नुल्ला में। नुल्ला वेल मेटस स्केलेरिस्क एंटी सोलिसिट्यूडिन। क्रास पुरुस ओडियो, वेस्टिबुलम में वल्पुटेट एट, टेम्पस विवेरा टर्पिस | Fusce condimentum nunc एसी निसी वल्पुटेट फ्रिंगिला। फौसिबस में डोनेक लैसिनिया कोंगे फेलिस। -
सूची आधारित मीडिया वस्तु
क्रास बैस अमेट निभ लिबेरो, ग्रेविडा नुल्ला में। नुल्ला वेल मेटस स्केलेरिस्क एंटी सोलिसिट्यूडिन। क्रास पुरुस ओडियो, वेस्टिबुलम में वल्पुटेट एट, टेम्पस विवेरा टर्पिस | Fusce condimentum nunc एसी निसी वल्पुटेट फ्रिंगिला। फौसिबस में डोनेक लैसिनिया कोंगे फेलिस।