Rubutu

Takaddun bayanai da misalai don kayan aikin rubutu gama gari don sarrafa jeri, nannade, nauyi, da ƙari.

Daidaita rubutu

Sauƙaƙe daidaita rubutu zuwa sassa tare da azuzuwan daidaita rubutu.

Amitioni yana ba da rarrabuwar kawuna iudicaretur. Cras mattis iudicium purus sit amet fermentum. Donc sed odio operae, eu vulputate felis rhoncus. Yi la'akari da halin da ake ciki. A cikin posthac, sitientis piros Afros. Yi la'akari da sibi concilium totius Galliae a cikin cikakken 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>

Don hagu, dama, da daidaitawar tsakiya, akwai azuzuwan amsa waɗanda ke amfani da wuraren faɗuwar ra'ayi iri ɗaya kamar tsarin grid.

Rubutun hagu mai layi akan duk girman tashar kallo.

Rubutun da aka daidaita a tsakiya akan duk girman tashar kallo.

Rubutun da aka daidaita daidai akan duk girman tashar kallo.

Rubutun hagu masu layi na hagu akan girman SM (kanana) ko mafi girma.

Rubutun hagu na hagu akan girman MD (matsakaici) ko mafi girma.

Rubutun hagu na hagu a kan madaidaitan madaidaicin LG (babba) ko mafi girma.

Rubutun hagu mai layi na hagu akan madaidaicin madaidaicin XL (mafi girma) ko mafi girma.

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

Rubutun rubutu da ambaliya

Rufe rubutu tare da .text-wrapaji.

Wannan rubutu ya kamata kunsa.

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

Hana rubutu daga nannade da .text-nowrapaji.

Wannan rubutu yakamata ya mamaye iyaye.

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

Don dogon abun ciki, zaku iya ƙara .text-truncateaji don datse rubutun tare da ellipsis. Ana bukata display: inline-blockko display: block.

Yi la'akari da halin da ake ciki.

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

Katse magana

Hana dogayen igiyoyin rubutu daga karya shimfidar abubuwan abubuwan da aka gyara ku ta amfani .text-breakda saita overflow-wrap: break-word(kuma word-break: break-worddon dacewa da IE & Edge).

mmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmm

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

Canjin rubutu

Canza rubutu a cikin sassa tare da azuzuwan babban rubutu.

Ƙananan rubutu.

Rubutun babba.

CapiTaliZed rubutu.

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

Yi la'akari da yadda .text-capitalizekawai ke canza harafin farko na kowace kalma, barin yanayin kowane haruffa ba tare da tasiri ba.

Nauyin rubutu da rubutun rubutu

Saurin canza nauyin (ƙarfin hali) na rubutu ko rubutun rubutu.

M rubutu.

Rubutun nauyi mai ƙarfi (dangane da kashi na iyaye).

Rubutun nauyi na al'ada.

Rubutun nauyi mai nauyi.

Rubutun nauyi mai sauƙi (dangane da kashi na iyaye).

Rubutun rubutun.

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

Monospace

Canza wani zaɓi zuwa tarin rubutun mu na monospace tare da .text-monospace.

Wannan yana cikin monospace

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

Sake saita launi

Sake saita rubutu ko launi na hanyar haɗin gwiwa tare da .text-reset, don ya gaji launi daga iyayensa.

Rubutun da aka kashe tare da hanyar haɗin sake saiti .

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

Adon rubutu

Cire kayan ado na rubutu tare da .text-decoration-noneaji.

Hanyar haɗin da ba ta ja layi ba

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