in English

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.

Maandishi fulani ya kishika nafasi ili kuonyesha upatanishi wa maandishi unaokubalika. Je, utanifanyia vivyo hivyo? Ni wakati wa kukabiliana na muziki mimi si jumba lako la kumbukumbu tena. Sikia ni nzuri, kuwa mwamuzi na wasichana wangu watapiga kura. Ninaweza kuhisi phoenix ndani yangu. Mbingu ina wivu kwa upendo wetu, malaika wanalia kutoka juu. Ndio, unanipeleka kwenye 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>

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

Uvunjaji wa maneno

Zuia mifuatano mirefu ya maandishi kutoka kwa kuvunja mpangilio wa vipengele vyako kwa kutumia .text-breakkuweka word-wrap: break-wordna word-break: break-word. Tunatumia word-wrapbadala ya ile inayojulikana zaidi overflow-wrapkwa usaidizi mpana wa kivinjari, na kuongeza iliyoacha kutumika word-break: break-wordili kuepuka matatizo na vyombo vinavyobadilikabadilika.

mmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmm

<p class="text-break">mmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmm</p>

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.

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