Tekst
Düzediş, gaplamak, agram we ş.m. gözegçilik etmek üçin umumy tekst enjamlary üçin resminamalar we mysallar.
Tekstiň deňleşdirilmegi
Teksti tekizlemek synplary bolan komponentlere aňsatlyk bilen tertipleşdiriň.
Käbir ýer eýesi tekst, dogry tekst deňleşmesini görkezmek üçin. Senem meniň üçin edersiňmi? Aýdym-saz bilen ýüzbe-ýüz bolmagyň wagty geldi, men indi seniň muzeýiň däl. Eşidiň, kazy boluň, gyzlarym ses bererler. Içimde feniks duýup bilerin. Jennet biziň söýgimize gabanjaň, perişdeler ýokardan aglaýarlar. Hawa, meni utopiýa äkidýärsiň.
<p class="text-justify">Some placeholder text to demonstrate justified text alignment. Will you do the same for me? It's time to face the music I'm no longer your muse. Heard it's beautiful, be the judge and my girls gonna take a vote. I can feel a phoenix inside of me. Heaven is jealous of our love, angels are crying from up above. Yeah, you take me to utopia.</p>Çep, sag we merkezi deňleşdirmek üçin, gözenegiň giňligi nokatlaryny gözenek ulgamy bilen ulanýan täsirli synplar bar.
Viewhli görnüş ölçeglerinde çep deňleşdirilen tekst.
Viewhli görnüş ölçeglerinde merkezleşdirilen tekst.
Viewhli görnüş ölçeglerinde sag deňleşdirilen tekst.
SM (kiçi) ýa-da has giň görnüşdäki görnüşlerde çep deňleşdirilen tekst.
MD (orta) ýa-da has giň görnüşdäki görnüşlerde çep deňleşdirilen tekst.
LG (uly) ýa-da has giň görnüşdäki görnüşlerde çep deňleşdirilen tekst.
XL ölçegli (goşmaça uly) ýa-da has giň görnüşdäki çep deňleşdirilen tekst.
<p class="text-left">Left aligned text on all viewport sizes.</p>
<p class="text-center">Center aligned text on all viewport sizes.</p>
<p class="text-right">Right aligned text on all viewport sizes.</p>
<p class="text-sm-left">Left aligned text on viewports sized SM (small) or wider.</p>
<p class="text-md-left">Left aligned text on viewports sized MD (medium) or wider.</p>
<p class="text-lg-left">Left aligned text on viewports sized LG (large) or wider.</p>
<p class="text-xl-left">Left aligned text on viewports sized XL (extra-large) or wider.</p>Tekstiň örtügi we aşmagy
Teksti .text-wrapsynp bilen örtüň.
<div class="badge badge-primary text-wrap" style="width: 6rem;">
This text should wrap.
</div>.text-nowrapTekstiň synp bilen örtülmeginiň öňüni alyň .
<div class="text-nowrap bd-highlight" style="width: 8rem;">
This text should overflow the parent.
</div>.text-truncateHas uzyn mazmun üçin teksti ellips bilen kesmek üçin synp goşup bilersiňiz . Talap display: inline-blockýa-da display: block.
<!-- Block level -->
<div class="row">
<div class="col-2 text-truncate">
Praeterea iter est quasdam res quas ex communi.
</div>
</div>
<!-- Inline level -->
<span class="d-inline-block text-truncate" style="max-width: 150px;">
Praeterea iter est quasdam res quas ex communi.
</span>Söz döwmek
.text-breakUzyn setirleri düzmek word-wrap: break-wordwe ulanmak arkaly komponentleriň düzülişini bozmagynyň öňüni alyň word-break: break-word. Has giň brauzer goldawy üçin has giň word-wrapýaýran ýerine ulanýarys we flex konteýnerler bilen baglanyşykly meselelerden gaça durmak üçin könelenleri goşýarys.overflow-wrapword-break: break-word
mmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmalar
<p class="text-break">mmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmm</p>Tekstiň üýtgemegi
Teksti tekst baş harplary bilen komponentlerde öwüriň.
Aşakdaky tekst
Baş harp
CapiTaliZed teksti.
<p class="text-lowercase">Lowercased text.</p>
<p class="text-uppercase">Uppercased text.</p>
<p class="text-capitalize">CapiTaliZed text.</p>Diňe .text-capitalizeher sözüň birinji harpyny üýtgedip, beýleki harplaryň ýagdaýyny täsirsiz goýuň.
Şriftiň agramy we ýazgy
Tekstiň agramyny (batyrlygyny) çalt üýtgediň ýa-da teksti çyzyň.
Goňur tekst
Has berk agram teksti (esasy elemente görä).
Adaty agram teksti.
Weighteňil agramly tekst.
Has ýeňil agram teksti (esasy elemente görä).
Göçme manyda
<p class="font-weight-bold">Bold text.</p>
<p class="font-weight-bolder">Bolder weight text (relative to the parent element).</p>
<p class="font-weight-normal">Normal weight text.</p>
<p class="font-weight-light">Light weight text.</p>
<p class="font-weight-lighter">Lighter weight text (relative to the parent element).</p>
<p class="font-italic">Italic text.</p>Monospace
Monososmos şrift toplumyna saýlamany üýtgediň .text-monospace.
Bu monosferada
<p class="text-monospace">This is in monospace</p>Reňkini üýtgetmek
Teksti ýa-da baglanyşygyň reňkini .text-resetene-atasyndan miras alar ýaly täzeden düzüň.
Täzeden baglanyşyk baglanyşygy bilen öçürilen tekst .
<p class="text-muted">
Muted text with a <a href="#" class="text-reset">reset link</a>.
</p>Tekst bezegi
Tekst bezegini .text-decoration-nonesynp bilen aýyryň.
<a href="#" class="text-decoration-none">Non-underlined link</a>