Testu

Documentazione è esempi per utilità di testu cumuni per cuntrullà l'allinjamentu, l'imballaggio, u pesu, è più.

Allineamentu di testu

Realignate facilmente u testu à i cumpunenti cù classi di allineamentu di testu.

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

Per l'allineamentu di a manca, di a diritta è di u centru, e classi rispunsevuli sò dispunibuli chì utilizanu i stessi punti di rottura di larghezza di vista cum'è u sistema di griglia.

Testu allinatu à manca nantu à tutte e dimensioni di vista.

Centra u testu allinatu nantu à tutte e dimensioni di vista.

Testu allinatu à destra nantu à tutte e dimensioni di vista.

Testu allinatu à manca nantu à i vetri di dimensione SM (picculu) o più largu.

Testu allinatu à manca nantu à i vetri di dimensione MD (mediu) o più largu.

Testu allinatu à manca nantu à i vetri di dimensioni LG (grande) o più largu.

Testu allinatu à manca nantu à i vetri di taglia XL (extra-large) o più largu.

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

Imballaggio di testu è overflow

Impedisce u testu di imballà cù una .text-nowrapclasse.

Stu testu duveria overflow u genitore.

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

Per un cuntenutu più longu, pudete aghjunghje una .text-truncateclassa per truncà u testu cù un ellipsis. Richiede display: inline-blocko display: block.

Praeterea iter est quasdam res quas ex communi.

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

Trasformazione di u testu

Trasfurmà u testu in cumpunenti cù classi di capitalizazione di testu.

Testu minuscule.

Testu in maiuscule.

Testu in majuscule.

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

Nota cumu text-capitalizecambia solu a prima lettera di ogni parolla, lascendu u casu di qualsiasi altre lettere micca affettatu.

Peso di font è italicu

Cambia rapidamente u pesu (audacia) di u testu o mette in corsu.

Testu in grassu.

Testu di pesu normale.

Testu di pisu ligeru.

Testu italicu.

<p class="font-weight-bold">Bold text.</p>
<p class="font-weight-normal">Normal weight text.</p>
<p class="font-weight-light">Light weight text.</p>
<p class="font-italic">Italic text.</p>