Atwerɛ
Nwoma ne nhwɛsoɔ a ɛfa nsɛm a wɔtaa de di dwuma ho mfasoɔ a wɔde hwɛ nhyiamu, nsɛm a wɔde kyekyere, emu duru, ne nea ɛkeka ho so.
Nsɛm a wɔakyerɛw no pɛpɛɛpɛ
Ɛnyɛ den sɛ wobɛsan asiesie nsɛm no akɔ afã horow a ɛwɔ nsɛm a wɔde hyɛ adesua ahorow mu.
Nsɛm bi a wɔde besi hɔ de kyerɛ nsɛm a ɛfata a ɛne ne ho hyia. Wobɛyɛ saa ara ama me? Ɛyɛ bere a ɛsɛ sɛ wuhyia nnwom no Menyɛ wo muse bio. Te sɛ ɛyɛ fɛ, yɛ ɔtemmufo na me mmeawa no bɛfa abatow. Mitumi te phoenix bi nka wɔ me mu. Ɔsoro ani bere yɛn dɔ, abɔfo resu afi soro. Yeah, wode me kɔ utopia.
<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>
Sɛ wopɛ benkum, nifa, ne mfinimfini nhyehyɛe a, mmuae adesua ahorow wɔ hɔ a ɛde viewport trɛw breakpoints koro no ara di dwuma sɛ grid nhyehyɛe no.
Nkyerɛwee a wɔahyehyɛ no benkum so wɔ viewport akɛse nyinaa so.
Nsɛm a wɔahyehyɛ no mfinimfini wɔ viewport akɛse nyinaa so.
Nsɛm a wɔahyehyɛ no nifa so wɔ viewport akɛse nyinaa so.
Nsɛm a wɔahyehyɛ no benkum so wɔ viewports a ne kɛse yɛ SM (ketewa) anaa nea ɛtrɛw so.
Nsɛm a wɔahyehyɛ no benkum so wɔ viewports a ne kɛse yɛ MD (medium) anaa nea ɛtrɛw so.
Nsɛm a wɔahyehyɛ no benkum so wɔ viewports a ne kɛse yɛ LG (kɛse) anaa nea ɛtrɛw so.
Nsɛm a wɔahyehyɛ no benkum so wɔ viewports a ne kɛse yɛ XL (extra-large) anaa nea ɛtrɛw so.
<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>
Nsɛm a wɔde kyekyere ne nea ɛboro so
Fa .text-wrap
adesuakuw bi kyekyere nsɛm ho.
<div class="badge badge-primary text-wrap" style="width: 6rem;">
This text should wrap.
</div>
Siw nsɛm a wɔde bɛkyekyere .text-nowrap
adesua no ano.
<div class="text-nowrap bd-highlight" style="width: 8rem;">
This text should overflow the parent.
</div>
Sɛ wopɛ nsɛm a ɛware a, wubetumi de .text-truncate
adesuakuw bi aka ho de atwa nkyerɛwee no mu denam ellipsis so. Ɛhwehwɛ sɛ display: inline-block
anaasɛ 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>
Asɛmfua a wɔde paapae mu
Siw nsɛm nhama atenten a ɛbɛsɛe wo components no nhyehyɛe denam .text-break
to set word-wrap: break-word
ne a wode bedi dwuma no so word-break: break-word
. Yɛde di dwuma word-wrap
sen nea abu overflow-wrap
so kɛse no ma browser mmoa a ɛtrɛw, na yɛde nea wɔagyae no ka ho na word-break: break-word
yɛakwati nsɛm a ɛfa flex containers ho.
Mmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmm ɛsen mmammmmmmmmmmmmmmmmmmmmmmmmmmmm ɛsen mma ammfammmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmm ɛsen mma
<p class="text-break">mmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmm</p>
Nsɛm a wɔakyerɛw no dannan
Sesa nsɛm wɔ components mu a text capitalization adesua ahorow wom.
Nsɛm a wɔde nkyerɛwde nketewa ahyɛ mu.
Nsɛm a wɔakyerɛw no nkyerɛwde akɛse.
Nsɛm a wɔakyerɛw wɔ CapiTaliZed mu.
<p class="text-lowercase">Lowercased text.</p>
<p class="text-uppercase">Uppercased text.</p>
<p class="text-capitalize">CapiTaliZed text.</p>
Hyɛ sɛnea .text-capitalize
ɛsesa asɛmfua biara nkyerɛwde a edi kan nkutoo no nsow, na ɛma nkyerɛwde foforo biara asɛm no nnya nkɛntɛnso biara.
Font mu duru ne italics
Sesa nsɛm no mu duru (boldness) ntɛm ara anaa fa nsɛm a wɔakyerɛw no italic yɛ no.
Nsɛm a wɔakyerɛw no tuntum.
Bolder weight text (a ɛfa ɔwofo element no ho).
Nkyerɛwee a emu duru yɛ daa.
Nsɛm a emu yɛ hare.
Nsɛm a emu duru yɛ hare (a ɛfa ɔwofo element no ho).
Nkyerɛwee a wɔde nkyerɛwde a ɛyɛ mmerɛw di dwuma.
<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 a ɛwɔ hɔ
Sesa nea woapaw no kɔ yɛn monospace font stack no so denam .text-monospace
.
Eyi wɔ monospace mu
<p class="text-monospace">This is in monospace</p>
Fa kɔla no si hɔ bio
Fa , san hyehyɛ nsɛm anaa link bi kɔla .text-reset
, sɛnea ɛbɛyɛ a ebenya kɔla no afi ne wofo hɔ.
Nsɛm a wɔayɛ no mum a wɔde reset link ahyɛ mu .
<p class="text-muted">
Muted text with a <a href="#" class="text-reset">reset link</a>.
</p>
Nsɛm a wɔde siesie fie
Yi text decoration bi fi .text-decoration-none
adesuakuw bi mu.
<a href="#" class="text-decoration-none">Non-underlined link</a>