Source

Nkoma

Mikanda mpe bandakisa mpo na ba utilitaires ya makomi oyo bato mingi basalelaka mpo na kotambwisa boyokani, enveloppe, kilo, mpe mingi mosusu.

Kobongisa makomi

Facilement réaligner texte na ba composants na ba classes ya alignment ya texte.

Ambitioni ya kosala ba scripsisse na yo. Cras mattis iudicium purus efandi amet fermentum. Donec sed odio operae, eu vulputate felis rhoncus. Praeterea iter est quasdam oyo ezali na kati ya lisanga ya bato. Na nos hinc posthac, maladi ya mboka Afros. Petierunt uti sibi concilium totius Galliae na kati ya mokolo oyo ezali na nkombo indicere. Cras mattis iudicium purus efandi 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>

Mpo na alignment gauche, droite, mpe centre, ba classes responsives ezali oyo esalelaka ba points de rupture ya largeur ya port de vue ndenge moko na système ya grille.

Texte aligné gauche na ba taille nionso ya port de vue.

Centre aligné texte na ba taille nionso ya port de vue.

Texte aligné na droite na ba taille nionso ya port de vue.

Makomi oyo ezali na boyokani na lobɔkɔ ya mwasi na baporte ya kotala oyo ezali na bonene ya SM (ya moke) to ya monene koleka.

Makomi oyo ezali na boyokani na lobɔkɔ ya mwasi na baporte ya kotala oyo ezali na bonene ya MD (moyenne) to ya monene koleka.

Texte aligné gauche na ba viewports ya taille LG (ya monene) to ya large.

Texte aligné gauche na ba portes de vue ya taille XL (extra-large) to ya large.

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

Enveloppement ya texte na débordement

Pekisa makomi ekangama na .text-nowrapkelasi moko.

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

Mpo na makambo ya molai, okoki kobakisa .text-truncatekelasi mpo na kokata makomi na ellipse. Esɛngaka display: inline-blockto display: block.

Praeterea iter est quasdam oyo ezali na kati ya lisanga ya bato.
Praeterea iter est quasdam oyo ezali na kati ya lisanga ya bato.
<!-- 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>

Bobongoli makomi

Bobongola makomi na ba composants na ba classes ya makomi minene.

Makomi ya mike.

Makomi ya minene.

Mokanda oyo ekomami na CapitaliZed.

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

Talá ndenge text-capitalizeoyo ebongoli kaka lɛtrɛ ya liboso ya liloba mokomoko, mpe etikaka likambo ya balɛtrɛ mosusu nyonso ezala na bopusi te.

Kilo ya makomi mpe makomi ya italike

Bobongola nokinoki kilo (boldness) ya makomi to bongisá makomi na italic.

Makomi ya moindo makasi.

Texte ya poids normal.

Texte ya kilo ya pɛpɛlɛ.

Makomi oyo ezali na italike.

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

Monoespace moko

Bobongola boponi na ebele ya bafonte na biso ya monospace na .text-monospace.

Oyo ezali na monospace

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