बुटस्ट्र्यापका कार्डहरूले बहुविध भेरियन्टहरू र विकल्पहरूसँग लचिलो र एक्स्टेन्सिबल सामग्री कन्टेनर प्रदान गर्दछ।
बारे
कार्ड एक लचिलो र एक्स्टेन्सिबल सामग्री कन्टेनर हो। यसमा हेडर र फुटरहरू, सामग्रीको विस्तृत विविधता, प्रासंगिक पृष्ठभूमि रङहरू, र शक्तिशाली प्रदर्शन विकल्पहरू समावेश छन्। यदि तपाईं Bootstrap 3 सँग परिचित हुनुहुन्छ भने, कार्डहरूले हाम्रा पुराना प्यानलहरू, कुवाहरू, र थम्बनेलहरू प्रतिस्थापन गर्छन्। ती कम्पोनेन्टहरूसँग समान प्रकार्यता कार्डहरूको लागि परिमार्जक वर्गहरूको रूपमा उपलब्ध छ।
उदाहरण
कार्डहरू सकेसम्म थोरै मार्कअप र शैलीहरूसँग बनाइएका छन्, तर अझै पनि नियन्त्रण र अनुकूलनको एक टन प्रदान गर्न प्रबन्ध गर्नुहोस्। फ्लेक्सबक्सको साथ निर्मित, तिनीहरूले सजिलो पङ्क्तिबद्धता प्रस्ताव गर्छन् र अन्य बुटस्ट्र्याप घटकहरूसँग राम्रोसँग मिलाउँछन्। तिनीहरूसँग marginपूर्वनिर्धारित रूपमा कुनै छैन, त्यसैले आवश्यकता अनुसार स्पेसिङ उपयोगिताहरू प्रयोग गर्नुहोस्।
तल मिश्रित सामग्री र निश्चित चौडाइ भएको आधारभूत कार्डको उदाहरण हो। कार्डहरू सुरु गर्नको लागि कुनै निश्चित चौडाइ छैन, त्यसैले तिनीहरू स्वाभाविक रूपमा यसको मूल तत्वको पूर्ण चौडाइ भर्नेछन्। यो सजिलै संग हाम्रो विभिन्न आकार विकल्पहरु संग अनुकूलित छ ।
कार्ड शीर्षक
कार्डको शीर्षकमा निर्माण गर्न र कार्डको सामग्रीको ठूलो भाग बनाउनको लागि केही द्रुत उदाहरण पाठ।
कार्डहरूले छविहरू, पाठ, सूची समूहहरू, लिङ्कहरू, र थप सहित सामग्रीको विस्तृत विविधता समर्थन गर्दछ। तल समर्थन गरिएका उदाहरणहरू छन्।
जीउ
कार्डको निर्माण ब्लक हो .card-body। तपाईंलाई कार्ड भित्र प्याड गरिएको खण्डको आवश्यकता पर्दा यसलाई प्रयोग गर्नुहोस्।
यो कार्डको मुख्य भाग भित्र केहि पाठ हो।
शीर्षक, पाठ, र लिङ्कहरू
कार्ड शीर्षकहरू ट्यागमा थपेर .card-titleप्रयोग गरिन्छ । त्यसै गरी, लिङ्कहरू थपिन्छन् र ट्यागमा <h*>थपेर एकअर्काको छेउमा राखिन्छन् ।.card-link<a>
उपशीर्षकहरू ट्यागमा थपेर .card-subtitleप्रयोग गरिन्छ । <h*>यदि .card-titleर .card-subtitleवस्तुहरू .card-bodyवस्तुमा राखिएको छ भने, कार्ड शीर्षक र उपशीर्षक राम्रोसँग पङ्क्तिबद्ध छन्।
कार्ड शीर्षक
कार्ड उपशीर्षक
कार्डको शीर्षकमा निर्माण गर्न र कार्डको सामग्रीको ठूलो भाग बनाउनको लागि केही द्रुत उदाहरण पाठ।
.card-img-topकार्डको शीर्षमा छवि राख्छ। सँगै .card-text, पाठ कार्डमा थप्न सकिन्छ। भित्रको पाठलाई .card-textमानक HTML ट्यागहरूसँग पनि स्टाइल गर्न सकिन्छ।
कार्डको शीर्षकमा निर्माण गर्न र कार्डको सामग्रीको ठूलो भाग बनाउनको लागि केही द्रुत उदाहरण पाठ।
समूहहरू सूचीबद्ध गर्नुहोस्
फ्लश सूची समूहको साथ कार्डमा सामग्रीको सूचीहरू सिर्जना गर्नुहोस्।
Cras justo odio
Dapibus ac facilisis in
eros मा Vestibulum
चित्रित
Cras justo odio
Dapibus ac facilisis in
eros मा Vestibulum
भान्सा सिंक
तपाईलाई चाहिने कार्ड बनाउनको लागि धेरै सामग्री प्रकारहरू मिलाउनुहोस् र मिलाउनुहोस्, वा त्यहाँ सबै चीजहरू फ्याँक्नुहोस्। तल देखाइएको छ छवि शैलीहरू, ब्लकहरू, पाठ शैलीहरू, र सूची समूह - सबै एक निश्चित-चौडाइ कार्डमा बेरिएका छन्।
कार्ड शीर्षक
कार्डको शीर्षकमा निर्माण गर्न र कार्डको सामग्रीको ठूलो भाग बनाउनको लागि केही द्रुत उदाहरण पाठ।
कार्डहरूले सुरु गर्नको लागि कुनै विशिष्ट मान्दैन width, त्यसैले तिनीहरू 100% चौडा हुनेछन् जबसम्म अन्यथा भनिएको छैन। तपाईंले यसलाई अनुकूलन CSS, ग्रिड वर्गहरू, ग्रिड Sass मिक्सिनहरू, वा उपयोगिताहरूसँग आवश्यकता अनुसार परिवर्तन गर्न सक्नुहुन्छ।
ग्रिड मार्कअप प्रयोग गर्दै
ग्रिड प्रयोग गरेर, कार्डहरू स्तम्भ र पङ्क्तिहरूमा बेर्नुहोस्।
विशेष शीर्षक उपचार
अतिरिक्त सामग्रीमा प्राकृतिक नेतृत्वको रूपमा तल समर्थन पाठको साथ।
तपाईंले कुनै पनि कार्डको पाठ पङ्क्तिबद्धतालाई द्रुत रूपमा परिवर्तन गर्न सक्नुहुन्छ - यसको सम्पूर्णता वा विशिष्ट भागहरूमा - हाम्रो पाठ पङ्क्तिबद्ध कक्षाहरूसँग ।
विशेष शीर्षक उपचार
अतिरिक्त सामग्रीमा प्राकृतिक नेतृत्वको रूपमा तल समर्थन पाठको साथ।
कार्डहरूले छविहरूसँग काम गर्नका लागि केही विकल्पहरू समावेश गर्दछ। कार्डको कुनै पनि छेउमा "छवि क्याप्स" थप्ने, कार्ड सामग्रीको साथ छविहरू ओभरले गर्ने, वा कार्डमा छवि इम्बेड गर्नबाट छनौट गर्नुहोस्।
छवि क्याप्स
हेडर र फुटरहरू जस्तै, कार्डहरूले माथि र तल "छवि क्याप्स" समावेश गर्न सक्छ - कार्डको माथि वा तल छविहरू।
कार्ड शीर्षक
यो अतिरिक्त सामग्रीमा प्राकृतिक नेतृत्वको रूपमा तल समर्थन पाठको साथ फराकिलो कार्ड हो। यो सामग्री अलि लामो छ।
पछिल्लो पटक ३ मिनेट पहिले अपडेट गरिएको थियो
कार्ड शीर्षक
यो अतिरिक्त सामग्रीमा प्राकृतिक नेतृत्वको रूपमा तल समर्थन पाठको साथ फराकिलो कार्ड हो। यो सामग्री अलि लामो छ।
पछिल्लो पटक ३ मिनेट पहिले अपडेट गरिएको थियो
छवि ओभरले
छविलाई कार्डको पृष्ठभूमिमा बदल्नुहोस् र आफ्नो कार्डको पाठ ओभरले गर्नुहोस्। छविमा निर्भर गर्दै, तपाईंलाई अतिरिक्त शैलीहरू वा उपयोगिताहरू आवश्यक पर्न सक्छ वा नहुन सक्छ।
कार्ड शीर्षक
यो अतिरिक्त सामग्रीमा प्राकृतिक नेतृत्वको रूपमा तल समर्थन पाठको साथ फराकिलो कार्ड हो। यो सामग्री अलि लामो छ।
पछिल्लो पटक ३ मिनेट पहिले अपडेट गरिएको थियो
ध्यान दिनुहोस् कि सामग्री छविको उचाइ भन्दा ठूलो हुनु हुँदैन। यदि सामग्री छवि भन्दा ठूलो छ भने सामग्री छवि बाहिर प्रदर्शित हुनेछ।
तेर्सो
ग्रिड र उपयोगिता वर्गहरूको संयोजन प्रयोग गरेर, कार्डहरूलाई मोबाइल-मैत्री र उत्तरदायी तरिकामा तेर्सो बनाउन सकिन्छ। तलको उदाहरणमा, हामी ब्रेकपोइन्टमा कार्डलाई तेर्सो बनाउनका लागि ग्रिड गटरहरू हटाउँछौं .no-guttersर कक्षाहरू प्रयोग गर्छौं। तपाईंको कार्ड सामग्रीको आधारमा थप समायोजनहरू आवश्यक हुन सक्छ।.col-md-*md
कार्ड शीर्षक
यो अतिरिक्त सामग्रीमा प्राकृतिक नेतृत्वको रूपमा तल समर्थन पाठको साथ फराकिलो कार्ड हो। यो सामग्री अलि लामो छ।
पछिल्लो पटक ३ मिनेट पहिले अपडेट गरिएको थियो
कार्ड शैलीहरू
कार्डहरूले तिनीहरूको पृष्ठभूमि, किनारा र रङ अनुकूलन गर्न विभिन्न विकल्पहरू समावेश गर्दछ।
कार्डको शीर्षकमा निर्माण गर्न र कार्डको सामग्रीको ठूलो भाग बनाउनको लागि केही द्रुत उदाहरण पाठ।
हेडर
माध्यमिक कार्ड शीर्षक
कार्डको शीर्षकमा निर्माण गर्न र कार्डको सामग्रीको ठूलो भाग बनाउनको लागि केही द्रुत उदाहरण पाठ।
हेडर
सफलता कार्ड शीर्षक
कार्डको शीर्षकमा निर्माण गर्न र कार्डको सामग्रीको ठूलो भाग बनाउनको लागि केही द्रुत उदाहरण पाठ।
हेडर
खतरा कार्ड शीर्षक
कार्डको शीर्षकमा निर्माण गर्न र कार्डको सामग्रीको ठूलो भाग बनाउनको लागि केही द्रुत उदाहरण पाठ।
हेडर
चेतावनी कार्ड शीर्षक
कार्डको शीर्षकमा निर्माण गर्न र कार्डको सामग्रीको ठूलो भाग बनाउनको लागि केही द्रुत उदाहरण पाठ।
हेडर
जानकारी कार्ड शीर्षक
कार्डको शीर्षकमा निर्माण गर्न र कार्डको सामग्रीको ठूलो भाग बनाउनको लागि केही द्रुत उदाहरण पाठ।
हेडर
हल्का कार्ड शीर्षक
कार्डको शीर्षकमा निर्माण गर्न र कार्डको सामग्रीको ठूलो भाग बनाउनको लागि केही द्रुत उदाहरण पाठ।
हेडर
गाढा कार्ड शीर्षक
कार्डको शीर्षकमा निर्माण गर्न र कार्डको सामग्रीको ठूलो भाग बनाउनको लागि केही द्रुत उदाहरण पाठ।
सहयोगी टेक्नोलोजीहरूको अर्थ बुझाउँदै
अर्थ थप्न रङको प्रयोगले मात्र दृश्य सङ्केत प्रदान गर्दछ, जुन सहायक प्रविधिहरूका प्रयोगकर्ताहरूलाई जानकारी दिइने छैन - जस्तै स्क्रिन रिडरहरू। सुनिश्चित गर्नुहोस् कि रङद्वारा संकेत गरिएको जानकारी या त सामग्रीबाट नै स्पष्ट छ (जस्तै देखिने पाठ), वा वैकल्पिक माध्यमहरू मार्फत समावेश गरिएको छ, जस्तै .sr-onlyकक्षासँग लुकेको अतिरिक्त पाठ।
सिमाना
केवल एक कार्ड परिवर्तन गर्न सीमा उपयोगिताहरू प्रयोग गर्नुहोस्। ध्यान दिनुहोस् कि तपाइँ तल देखाइए अनुसार अभिभावक वा कार्डको सामग्रीको सबसेटमा कक्षाहरू border-colorराख्न सक्नुहुन्छ ।.text-{color}.card
हेडर
प्राथमिक कार्ड शीर्षक
कार्डको शीर्षकमा निर्माण गर्न र कार्डको सामग्रीको ठूलो भाग बनाउनको लागि केही द्रुत उदाहरण पाठ।
हेडर
माध्यमिक कार्ड शीर्षक
कार्डको शीर्षकमा निर्माण गर्न र कार्डको सामग्रीको ठूलो भाग बनाउनको लागि केही द्रुत उदाहरण पाठ।
हेडर
सफलता कार्ड शीर्षक
कार्डको शीर्षकमा निर्माण गर्न र कार्डको सामग्रीको ठूलो भाग बनाउनको लागि केही द्रुत उदाहरण पाठ।
हेडर
खतरा कार्ड शीर्षक
कार्डको शीर्षकमा निर्माण गर्न र कार्डको सामग्रीको ठूलो भाग बनाउनको लागि केही द्रुत उदाहरण पाठ।
हेडर
चेतावनी कार्ड शीर्षक
कार्डको शीर्षकमा निर्माण गर्न र कार्डको सामग्रीको ठूलो भाग बनाउनको लागि केही द्रुत उदाहरण पाठ।
हेडर
जानकारी कार्ड शीर्षक
कार्डको शीर्षकमा निर्माण गर्न र कार्डको सामग्रीको ठूलो भाग बनाउनको लागि केही द्रुत उदाहरण पाठ।
हेडर
हल्का कार्ड शीर्षक
कार्डको शीर्षकमा निर्माण गर्न र कार्डको सामग्रीको ठूलो भाग बनाउनको लागि केही द्रुत उदाहरण पाठ।
हेडर
गाढा कार्ड शीर्षक
कार्डको शीर्षकमा निर्माण गर्न र कार्डको सामग्रीको ठूलो भाग बनाउनको लागि केही द्रुत उदाहरण पाठ।
मिक्सन उपयोगिताहरू
तपाईले कार्ड हेडर र फुटरमा आवश्यक पर्ने सीमानाहरू पनि परिवर्तन गर्न सक्नुहुन्छ, र तिनीहरूलाई background-colorबाट हटाउन पनि सक्नुहुन्छ .bg-transparent।
हेडर
सफलता कार्ड शीर्षक
कार्डको शीर्षकमा निर्माण गर्न र कार्डको सामग्रीको ठूलो भाग बनाउनको लागि केही द्रुत उदाहरण पाठ।
कार्ड लेआउट
कार्डहरू भित्र सामग्री स्टाइल गर्नुको अतिरिक्त, बुटस्ट्र्यापले कार्डहरूको श्रृंखला बिछ्याउनका लागि केही विकल्पहरू समावेश गर्दछ। समयको लागि, यी लेआउट विकल्पहरू अझै उत्तरदायी छैनन् ।
कार्ड समूहहरू
समान चौडाइ र उचाइ स्तम्भहरूसँग एकल, संलग्न तत्वको रूपमा कार्डहरू प्रस्तुत गर्न कार्ड समूहहरू प्रयोग गर्नुहोस्। कार्ड समूहहरूले display: flex;आफ्नो समान आकार प्राप्त गर्न प्रयोग गर्छन्।
कार्ड शीर्षक
यो अतिरिक्त सामग्रीमा प्राकृतिक नेतृत्वको रूपमा तल समर्थन पाठको साथ फराकिलो कार्ड हो। यो सामग्री अलि लामो छ।
पछिल्लो पटक ३ मिनेट पहिले अपडेट गरिएको थियो
कार्ड शीर्षक
यस कार्डमा अतिरिक्त सामग्रीमा प्राकृतिक नेतृत्वको रूपमा तलको पाठलाई समर्थन गरिएको छ।
पछिल्लो पटक ३ मिनेट पहिले अपडेट गरिएको थियो
कार्ड शीर्षक
यो अतिरिक्त सामग्रीमा प्राकृतिक नेतृत्वको रूपमा तल समर्थन पाठको साथ फराकिलो कार्ड हो। यो कार्डमा समान उचाइ कार्य देखाउने पहिलो भन्दा अझ लामो सामग्री छ।
पछिल्लो पटक ३ मिनेट पहिले अपडेट गरिएको थियो
फुटरहरूसँग कार्ड समूहहरू प्रयोग गर्दा, तिनीहरूको सामग्री स्वचालित रूपमा लाइन अप हुनेछ।
कार्ड शीर्षक
यो अतिरिक्त सामग्रीमा प्राकृतिक नेतृत्वको रूपमा तल समर्थन पाठको साथ फराकिलो कार्ड हो। यो सामग्री अलि लामो छ।
कार्ड शीर्षक
यस कार्डमा अतिरिक्त सामग्रीमा प्राकृतिक नेतृत्वको रूपमा तलको पाठलाई समर्थन गरिएको छ।
कार्ड शीर्षक
यो अतिरिक्त सामग्रीमा प्राकृतिक नेतृत्वको रूपमा तल समर्थन पाठको साथ फराकिलो कार्ड हो। यो कार्डमा समान उचाइ कार्य देखाउने पहिलो भन्दा अझ लामो सामग्री छ।
कार्ड डेक
बराबर चौडाइ र उचाइ कार्डहरूको सेट चाहिन्छ जुन एकअर्कासँग जोडिएको छैन? कार्ड डेक प्रयोग गर्नुहोस्।
कार्ड शीर्षक
यो अतिरिक्त सामग्रीको लागि प्राकृतिक नेतृत्वको रूपमा तल समर्थन पाठको साथ लामो कार्ड हो। यो सामग्री अलि लामो छ।
पछिल्लो पटक ३ मिनेट पहिले अपडेट गरिएको थियो
कार्ड शीर्षक
यस कार्डमा अतिरिक्त सामग्रीमा प्राकृतिक नेतृत्वको रूपमा तलको पाठलाई समर्थन गरिएको छ।
पछिल्लो पटक ३ मिनेट पहिले अपडेट गरिएको थियो
कार्ड शीर्षक
यो अतिरिक्त सामग्रीमा प्राकृतिक नेतृत्वको रूपमा तल समर्थन पाठको साथ फराकिलो कार्ड हो। यो कार्डमा समान उचाइ कार्य देखाउने पहिलो भन्दा अझ लामो सामग्री छ।
यो अतिरिक्त सामग्रीमा प्राकृतिक नेतृत्वको रूपमा तल समर्थन पाठको साथ फराकिलो कार्ड हो। यो सामग्री अलि लामो छ।
कार्ड शीर्षक
यस कार्डमा अतिरिक्त सामग्रीमा प्राकृतिक नेतृत्वको रूपमा तलको पाठलाई समर्थन गरिएको छ।
कार्ड शीर्षक
यो अतिरिक्त सामग्रीमा प्राकृतिक नेतृत्वको रूपमा तल समर्थन पाठको साथ फराकिलो कार्ड हो। यो कार्डमा समान उचाइ कार्य देखाउने पहिलो भन्दा अझ लामो सामग्री छ।
ग्रिड कार्डहरू
बुटस्ट्र्याप ग्रिड प्रणाली र यसको .row-colsकक्षाहरू प्रयोग गर्नुहोस् कति ग्रिड स्तम्भहरू (तपाईंको कार्डहरू वरिपरि बेरिएको) तपाईंले प्रति पङ्क्ति देखाउनुहुन्छ नियन्त्रण गर्न। उदाहरणका लागि, यहाँ .row-cols-1एउटा स्तम्भमा कार्डहरू बिछ्याउँदै छ, र .row-cols-md-2चारवटा कार्डहरूलाई धेरै पङ्क्तिहरूमा बराबर चौडाइमा विभाजन गर्दै, मध्यम ब्रेकपोइन्ट अपबाट।
कार्ड शीर्षक
यो अतिरिक्त सामग्रीको लागि प्राकृतिक नेतृत्वको रूपमा तल समर्थन पाठको साथ लामो कार्ड हो। यो सामग्री अलि लामो छ।
कार्ड शीर्षक
यो अतिरिक्त सामग्रीको लागि प्राकृतिक नेतृत्वको रूपमा तल समर्थन पाठको साथ लामो कार्ड हो। यो सामग्री अलि लामो छ।
कार्ड शीर्षक
यो अतिरिक्त सामग्रीको लागि प्राकृतिक नेतृत्वको रूपमा तल समर्थन पाठको साथ लामो कार्ड हो।
कार्ड शीर्षक
यो अतिरिक्त सामग्रीको लागि प्राकृतिक नेतृत्वको रूपमा तल समर्थन पाठको साथ लामो कार्ड हो। यो सामग्री अलि लामो छ।
यसलाई परिवर्तन गर्नुहोस् .row-cols-3र तपाईंले चौथो कार्ड र्याप देख्नुहुनेछ।
कार्ड शीर्षक
यो अतिरिक्त सामग्रीको लागि प्राकृतिक नेतृत्वको रूपमा तल समर्थन पाठको साथ लामो कार्ड हो। यो सामग्री अलि लामो छ।
कार्ड शीर्षक
यो अतिरिक्त सामग्रीको लागि प्राकृतिक नेतृत्वको रूपमा तल समर्थन पाठको साथ लामो कार्ड हो। यो सामग्री अलि लामो छ।
कार्ड शीर्षक
यो अतिरिक्त सामग्रीको लागि प्राकृतिक नेतृत्वको रूपमा तल समर्थन पाठको साथ लामो कार्ड हो।
कार्ड शीर्षक
यो अतिरिक्त सामग्रीको लागि प्राकृतिक नेतृत्वको रूपमा तल समर्थन पाठको साथ लामो कार्ड हो। यो सामग्री अलि लामो छ।
जब तपाईंलाई बराबर उचाइ चाहिन्छ .h-100, कार्डहरूमा थप्नुहोस्। यदि तपाइँ पूर्वनिर्धारित रूपमा समान उचाइहरू चाहनुहुन्छ भने, तपाइँ $card-height: 100%Sass मा सेट गर्न सक्नुहुन्छ।
कार्ड शीर्षक
यो अतिरिक्त सामग्रीको लागि प्राकृतिक नेतृत्वको रूपमा तल समर्थन पाठको साथ लामो कार्ड हो। यो सामग्री अलि लामो छ।
कार्ड शीर्षक
यो छोटो कार्ड हो।
कार्ड शीर्षक
यो अतिरिक्त सामग्रीको लागि प्राकृतिक नेतृत्वको रूपमा तल समर्थन पाठको साथ लामो कार्ड हो।
कार्ड शीर्षक
यो अतिरिक्त सामग्रीको लागि प्राकृतिक नेतृत्वको रूपमा तल समर्थन पाठको साथ लामो कार्ड हो। यो सामग्री अलि लामो छ।
कार्ड स्तम्भहरू
कार्डहरू मेसनरी -जस्तै स्तम्भहरूमा CSS मार्फत व्यवस्थित गर्न सकिन्छ .card-columns। कार्डहरू columnसजिलो पङ्क्तिबद्धताको लागि फ्लेक्सबक्सको सट्टा CSS गुणहरूसँग बनाइन्छ। कार्डहरू माथिबाट तल र बायाँबाट दायाँ अर्डर गरिएका छन्।
हेड अप! कार्ड स्तम्भहरूसँग तपाईंको माइलेज फरक हुन सक्छ। स्तम्भहरूमा कार्डहरू तोड्नबाट रोक्न, हामीले तिनीहरूलाई अझै बुलेटप्रूफ समाधान नभएको display: inline-blockरूपमा सेट गर्नुपर्छ ।column-break-inside: avoid
कार्ड शीर्षक जुन नयाँ लाइनमा लपेट्छ
यो अतिरिक्त सामग्रीको लागि प्राकृतिक नेतृत्वको रूपमा तल समर्थन पाठको साथ लामो कार्ड हो। यो सामग्री अलि लामो छ।
Lorem ipsum dolor sit amet, consectetur adipiscing elit। Integer posuere erat a ante.
कार्ड शीर्षक
यस कार्डमा अतिरिक्त सामग्रीमा प्राकृतिक नेतृत्वको रूपमा तलको पाठलाई समर्थन गरिएको छ।
पछिल्लो पटक ३ मिनेट पहिले अपडेट गरिएको थियो
Lorem ipsum dolor sit amet, consectetur adipiscing elit। पूर्णाङ्क स्थिति।
कार्ड शीर्षक
यो कार्डमा नियमित शीर्षक र यसको तल पाठको छोटो अनुच्छेद छ।
पछिल्लो पटक ३ मिनेट पहिले अपडेट गरिएको थियो
Lorem ipsum dolor sit amet, consectetur adipiscing elit। Integer posuere erat a ante.
कार्ड शीर्षक
यो तल शीर्षक र समर्थन पाठ संग अर्को कार्ड हो। यो कार्डलाई समग्रमा थोरै अग्लो बनाउनको लागि केही अतिरिक्त सामग्रीहरू छन्।
पछिल्लो पटक ३ मिनेट पहिले अपडेट गरिएको थियो
कार्ड स्तम्भहरू पनि विस्तार गर्न सकिन्छ र केहि अतिरिक्त कोडको साथ अनुकूलित गर्न सकिन्छ। तल देखाइएको कक्षाको विस्तार हो जुन .card-columnsहामीले प्रयोग गर्ने समान CSS प्रयोग गर्छौं — CSS स्तम्भहरू — स्तम्भहरूको संख्या परिवर्तन गर्नका लागि प्रतिक्रियाशील तहहरूको सेट उत्पन्न गर्न।