पाठ
पङ्क्तिबद्धता, र्यापिङ, वजन, र थप नियन्त्रण गर्न सामान्य पाठ उपयोगिताहरूको लागि दस्तावेज र उदाहरणहरू।
पाठ पङ्क्तिबद्धता
पाठ पङ्क्तिबद्ध वर्गहरूको साथ कम्पोनेन्टहरूमा सजिलैसँग पाठ पुन: मिलाउनुहोस्।
Ambitioni dedisse scripsisse iudicaretur। Cras mattis iudicium purus sit amet fermentum। Donec sed odio operae, eu vulputate felis rhoncus। Praetera iter est quasdam res quas ex communi। nos hinc posthac मा, sitientis piros Afros। Petierunt uti sibi concilium totius Galliae in diem certam indicere। Cras mattis iudicium purus sit amet fermentum।
बायाँ, दायाँ, र केन्द्र पङ्क्तिबद्धताका लागि, प्रतिक्रियाशील कक्षाहरू उपलब्ध छन् जसले ग्रिड प्रणालीको रूपमा उही भ्यूपोर्ट चौडाइ ब्रेकपोइन्टहरू प्रयोग गर्दछ।
सबै भ्युपोर्ट आकारहरूमा बायाँ पङ्क्तिबद्ध पाठ।
सबै भ्यूपोर्ट आकारहरूमा केन्द्रमा पङ्क्तिबद्ध पाठ।
सबै भ्युपोर्ट आकारहरूमा दायाँ पङ्क्तिबद्ध पाठ।
भ्युपोर्ट साइजको SM (सानो) वा फराकिलोमा बायाँ पङ्क्तिबद्ध पाठ।
बायाँ पङ्क्तिबद्ध पाठ भ्युपोर्ट साइज MD (मध्यम) वा फराकिलो।
एलजी (ठूलो) वा फराकिलो आकारको भ्यूपोर्टहरूमा बायाँ पङ्क्तिबद्ध पाठ।
भ्यूपोर्ट साइजको XL (अतिरिक्त-ठूलो) वा फराकिलोमा बायाँ पङ्क्तिबद्ध पाठ।
पाठ र्यापिङ र ओभरफ्लो
.text-wrap
कक्षाको साथ पाठ लपेट्नुहोस् ।
पाठलाई .text-nowrap
कक्षासँग र्याप गर्नबाट रोक्नुहोस्।
.text-truncate
लामो सामग्रीको लागि, तपाईंले एलिपसिसको साथ पाठ काट्नको लागि कक्षा थप्न सक्नुहुन्छ । आवश्यक छ display: inline-block
वा display: block
।
शब्द ब्रेक
.text-break
सेट word-wrap: break-word
र word-break: break-word
. _ हामी फराकिलो ब्राउजर समर्थनको लागि word-wrap
अधिक सामान्यको सट्टा प्रयोग गर्छौं, र फ्लेक्स कन्टेनरहरूमा समस्याहरूबाट बच्न बहिष्कृत थप्नुहोस्।overflow-wrap
word-break: break-word
मममममममममममममममममममममममममममममममममममममममममममममममममममममममममम
पाठ रूपान्तरण
पाठ क्यापिटलाइजेशन वर्गहरूको साथ घटकहरूमा पाठ रूपान्तरण गर्नुहोस्।
सानो अक्षरको पाठ।
ठूलो अक्षरमा लेखिएको पाठ।
CapitaliZed पाठ।
ध्यान दिनुहोस् कि कसरी .text-capitalize
प्रत्येक शब्दको पहिलो अक्षर मात्र परिवर्तन हुन्छ, कुनै पनि अन्य अक्षरहरूको केस अप्रभावित छोडेर।
फन्ट वजन र इटालिक
द्रुत रूपमा पाठको वजन (बोल्डनेस) परिवर्तन गर्नुहोस् वा पाठ इटालिक गर्नुहोस्।
बोल्ड टेक्स्ट।
बोल्ड वजन पाठ (अभिभावक तत्व सापेक्ष)।
सामान्य वजन पाठ।
हल्का वजन पाठ।
हल्का वजनको पाठ (अभिभावक तत्वसँग सापेक्ष)।
इटालिक पाठ।
मोनोस्पेस
हाम्रो मोनोस्पेस फन्ट स्ट्याकमा चयन परिवर्तन गर्नुहोस् .text-monospace
।
यो मोनोस्पेस मा छ
रङ रिसेट गर्नुहोस्
पाठ वा लिङ्कको रङसँग रिसेट गर्नुहोस् .text-reset
, जसले गर्दा यसले आफ्नो अभिभावकबाट रङ प्राप्त गर्छ।
रिसेट लिङ्कको साथ म्यूट गरिएको पाठ ।
पाठ सजावट
.text-decoration-none
कक्षाको साथ पाठ सजावट हटाउनुहोस् ।