Maandishi

Uhifadhi wa hati na mifano ya huduma za kawaida za maandishi ili kudhibiti upatanishi, kufunga, uzito na zaidi.

Mpangilio wa maandishi

Pangilia maandishi upya kwa vipengele kwa urahisi na madarasa ya upatanishi wa maandishi.

Ambitioni dedisse scripsisse iudicaretur. Cras mattis iudicum purus sit amet fermentum. Donec sed odio operae, eu vulputate felis rhoncus. Praeterea iter est quasdam res quas ex communi. Katika nos hinc posthac, sitientis piros Afros. Petierunt uti sibi concilium totius Galliae in diem certam indicere. Cras mattis iudicum 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>

Kwa upangaji wa kushoto, kulia na katikati, madarasa ya mwitikio yanapatikana ambayo yanatumia viingilio sawa vya upana wa kituo cha kutazama kama mfumo wa gridi ya taifa.

Maandishi yaliyopangiliwa kushoto kwenye saizi zote za kituo cha kutazama.

Maandishi yaliyopangiliwa katikati kwenye saizi zote za kituo cha kutazama.

Maandishi yaliyopangiliwa kulia kwenye saizi zote za kituo cha kutazama.

Maandishi yaliyopangiliwa kushoto kwenye ukubwa wa SM (ndogo) au pana zaidi.

Maandishi yaliyopangiliwa kushoto kwenye MD ya ukubwa wa vituo vya kutazama (kati) au pana.

Maandishi yaliyopangiliwa kushoto kwenye vituo vya kutazama vya ukubwa wa LG (kubwa) au pana.

Maandishi yaliyopangiliwa kushoto kwenye XL ya ukubwa wa vituo vya kutazama (kubwa zaidi) au pana.

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

Kufunga maandishi na kufurika

Funga maandishi na .text-wrapdarasa.

Nakala hii inapaswa kufungwa.

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

Zuia maandishi yasifungwe na .text-nowrapdarasa.

Maandishi haya yanapaswa kufurika mzazi.

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

Kwa maudhui marefu, unaweza kuongeza .text-truncatedarasa ili kupunguza maandishi kwa duaradufu. Inahitaji display: inline-blockau 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>

Kubadilisha maandishi

Badilisha maandishi katika vipengele na madarasa ya herufi kubwa ya maandishi.

Maandishi yenye herufi ndogo.

Maandishi yenye herufi kubwa.

Maandishi ya CapiTaliZed.

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

Kumbuka jinsi .text-capitalizetu kubadilisha herufi ya kwanza ya kila neno, na kuacha kesi ya herufi nyingine yoyote bila kuathiriwa.

Uzito wa herufi na italiki

Badilisha kwa haraka uzito (ujasiri) wa maandishi au maandishi ya italiki.

Maandishi mazito.

Maandishi ya uzani mzito (yanayohusiana na kipengele cha mzazi).

Maandishi ya uzito wa kawaida.

Nakala ya uzito mwepesi.

Nakala nyepesi ya uzani (kuhusiana na kipengele cha mzazi).

Maandishi ya italiki.

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

Nafasi moja

Badilisha chaguo kuwa safu yetu ya fonti ya nafasi moja na .text-monospace.

Hii ni katika nafasi moja

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

Weka upya rangi

Weka upya rangi ya maandishi au kiungo na .text-reset, ili irithi rangi kutoka kwa mzazi wake.

Maandishi yamenyamazishwa kwa kiungo cha kuweka upya .

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

Mapambo ya maandishi

Ondoa mapambo ya maandishi na .text-decoration-nonedarasa.

Kiungo kisichopigiwa mstari

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