Tɛks

Dokumɛnt ɛn ɛgzampul fɔ kɔmɔn tɛks yutiliti fɔ kɔntrol alaynɛshɔn, rap, wet, ɛn ɔda tin dɛn.

Teks alaynɛshɔn

I izi fɔ rialayn tɛks to kɔmpɔnɛnt dɛn wit tɛks alaynɛshɔn klas dɛn.

Ambitioni dedisse fɔ rayt fɔ yuz fɔ rayt. Kras matis iudicium purus sidon amet fεmεnt. Donec sed odio operae, yu vulputate felis rכnkɔs. Praeterea iter est kwasdam res kwas ex komyun. Na nos hinc posthac, sitientis piros Afros. Petierunt uti sibi konsiliɔm totiɔs Galia in diem sɛrtam indisɛri. Kras matis iudicium purus sidon amet fεmεnt.

<p class="text-justify">Ambitioni dedisse scripsisse iudicaretur. Cras mattis iudicium purus sit amet fermentum. Donec sed odio operae, eu vulputate felis rhoncus. Praeterea iter est quasdam res quas ex communi. At nos hinc posthac, sitientis piros Afros. Petierunt uti sibi concilium totius Galliae in diem certam indicere. Cras mattis iudicium purus sit amet fermentum.</p>

Fɔ lɛft, rayt, ɛn sɛnta alaynɛshɔn, rispɔnsiv klas dɛn de we de yuz di sem viupɔt wid brekpɔynt dɛn we di grid sistem de yuz.

Left alaynɛt tɛks pan ɔl di sayz dɛn fɔ di viupɔt.

Sɛntral alaynɛd tɛks pan ɔl di sayz dɛn fɔ di viupɔt.

Rayt alaynɛt tɛks pan ɔl di sayz dɛn fɔ di viupɔt.

Left alaynɛt tɛks pan viupɔt dɛn we gɛt saiz SM (smɔl) ɔ we big pas dat.

Left alayned tɛks pan viupɔt dɛn we gɛt saiz MD (midul) ɔ we big pas dat.

Left alaynɛt tɛks pan viupɔt dɛn we gɛt LG (big) ɔ we big pas dat.

Left alayned tɛks pan viupɔt dɛn we gɛt sayz XL (ɛkstra-big) ɔ we big pas dat.

<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>

Tekst wrap ɛn ɔvaflɔ

Rap tɛks wit wan .text-wrapklas.

Dis tɛks fɔ rap.

<div class="badge badge-primary text-wrap" style="width: 6rem;">
  This text should wrap.
</div>

Nɔ mek tɛks nɔ rap wit wan .text-nowrapklas.

Dis tɛks fɔ ful-ɔp di mama ɔ papa.

<div class="text-nowrap bd-highlight" style="width: 8rem;">
  This text should overflow the parent.
</div>

Fɔ mek yu gɛt lɔng kɔntinyu, yu kin ad wan .text-truncateklas fɔ kɔt di tɛks wit ɛlipsis. I nid fɔ gɛt display: inline-blockɔ display: block.

Praeterea iter est kwasdam res kwas ex komyun.

<!-- 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>

Tekst transfɔm

Transfɔm tɛks insay kɔmpɔnɛnt dɛn wit tɛks kapitaylayz klas dɛn.

Tekst we gɛt smɔl smɔl lɛta dɛn.

Di tɛks we gɛt big big lɛta dɛn.

Tekst we dɛn dɔn Kapitaliz.

<p class="text-lowercase">Lowercased text.</p>
<p class="text-uppercase">Uppercased text.</p>
<p class="text-capitalize">CapiTaliZed text.</p>

Notis aw i .text-capitalizejɔs de chenj di fɔs lɛta fɔ ɛni wɔd, ɛn lɛf di kes fɔ ɛni ɔda lɛta nɔ afɛkt.

Fɔnt wet ɛn italiks

Chenj di wet (boldnɛs) fɔ di tɛks kwik kwik wan ɔ rayt di tɛks italiks.

Tekst we gɛt bold.

Bolder weit tɛks (rilaytiv to di mama ɛn papa ɛlimɛnt).

Nɔmal wet tɛks.

Layt wet tɛks.

Layt wet tɛks (rilaytiv to di mama ɛn papa ɛlimɛnt).

Tekst we dɛn rayt wit italik.

<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>

Monospɛs

Chenj wan sɛlɛkshɔn to wi monospace font stak wit .text-monospace.

Dis na insay wan ples

<p class="text-monospace">This is in monospace</p>

Riset di kɔlɔ

Riset wan tɛks ɔ link in kɔlɔ wit .text-reset, so dat i go gɛt di kɔlɔ frɔm in mama ɔ papa.

Tekst we dɛn dɔn muv wit wan link we de riset .

<p class="text-muted">
  Muted text with a <a href="#" class="text-reset">reset link</a>.
</p>

Teks dɛkɔreshɔn

Rimov wan tɛks dɛkɔreshɔn wit wan .text-decoration-noneklas.

Link we nɔ de ɔndalayn

<a href="#" class="text-decoration-none">Non-underlined link</a>