Tibeji

Matsalwa na swikombiso swa tibeji, xiphemu xa hina xa ku hlayela lokutsongo na ku lebula.

Xikombiso

Tibeji ti pima ku fambisana na mpimo wa xiaki xa mutswari wa le kusuhi hi ku tirhisa mpimo wa fonto lowu yelanaka na emtiyuniti.

Xikombiso xa nhlokomhakaXintshwa

<h1>Example heading <span class="badge badge-secondary">New</span></h1>
<h2>Example heading <span class="badge badge-secondary">New</span></h2>
<h3>Example heading <span class="badge badge-secondary">New</span></h3>
<h4>Example heading <span class="badge badge-secondary">New</span></h4>
<h5>Example heading <span class="badge badge-secondary">New</span></h5>
<h6>Example heading <span class="badge badge-secondary">New</span></h6>

Tibeji tinga tirhisiwa tani hi xiphemu xa swihlanganisi kumbe swikomba-nkarhi ku nyika xibalo.

<button type="button" class="btn btn-primary">
  Notifications <span class="badge badge-light">4</span>
</button>

Xiya leswaku swi titshege hi ndlela leyi ti tirhisiwaka ha yona, tibeji ti nga ha pfilunganya vatirhisi va swihlaya-swikirini ni thekinoloji leyi fanaka leyi pfunaka. Hambileswi ku endliwa ka switayili swa tibeji swi nyikaka xikombiso lexi vonakaka xa xikongomelo xa tona, vatirhisi lava va ta nyikiwa ntsena leswi nga endzeni ka beji. Hi ku ya hi xiyimo xo karhi, tibeji leti ti nga ha vonaka ti ri marito lama engetelekeke lama nga hlelekangiki kumbe tinomboro emakumu ka xivulwa, xihlanganisi kumbe buti.

Handle ka loko mongo wu ri erivaleni (tanihi le ka xikombiso xa “Switiviso”, laha ku twisisiwaka leswaku “4” i nhlayo ya switiviso), ehleketa ku katsa mongo lowu engetelekeke hi xiphemu xa tsalwa ro engetela leri fihliweke hi mahlo.

<button type="button" class="btn btn-primary">
  Profile <span class="badge badge-light">9</span>
  <span class="sr-only">unread messages</span>
</button>

Ku hambana ka mongo

Engetela yin’wana na yin’wana ya titlilasi ta swihundzuluxi leti boxiweke laha hansi ku cinca ku languteka ka beji.

Phurayimari Xikolo xa vumbirhi Humelela Nghozi Xilemukisi Info Rivoni Xinyama

<span class="badge badge-primary">Primary</span>
<span class="badge badge-secondary">Secondary</span>
<span class="badge badge-success">Success</span>
<span class="badge badge-danger">Danger</span>
<span class="badge badge-warning">Warning</span>
<span class="badge badge-info">Info</span>
<span class="badge badge-light">Light</span>
<span class="badge badge-dark">Dark</span>

Ku hundzisela nhlamuselo eka thekinoloji yo pfuneta

Ku tirhisa muvala ku engetela nhlamuselo swi nyika ntsena xikombiso xa xivono, lexi nga ta ka xi nga hundziseriwi eka vatirhisi va thekinoloji yo pfuneta – ku fana na swihlaya swa xikirini. Tiyisisa leswaku mahungu lama kombisiweke hi muvala ya le rivaleni eka nhundzu hi yoxe (xikombiso tsalwa leri vonakaka), kumbe ya katsiwile hi tindlela tin’wana, ku fana na tsalwa ro engetela leri fihliweke na .sr-onlytlilasi.

Tibeji ta maphilisi

Tirhisa .badge-pilltlilasi ya mucinci ku endla leswaku tibeji ti va xirhendzevutani swinene (na horizontal leyikulu border-radiusni leyi engetelekeke padding). Swi pfuna loko u hundza eka tibeji leti humaka eka v3.

Phurayimari Xikolo xa vumbirhi Humelela Nghozi Xilemukisi Info Rivoni Xinyama

<span class="badge badge-pill badge-primary">Primary</span>
<span class="badge badge-pill badge-secondary">Secondary</span>
<span class="badge badge-pill badge-success">Success</span>
<span class="badge badge-pill badge-danger">Danger</span>
<span class="badge badge-pill badge-warning">Warning</span>
<span class="badge badge-pill badge-info">Info</span>
<span class="badge badge-pill badge-light">Light</span>
<span class="badge badge-pill badge-dark">Dark</span>

Swihlanganisi

Ku tirhisa .badge-*titlilasi ta xiyimo eka <a>elemente hi ku hatlisa swi nyika tibeji leti nga endliwaka na swiyimo swa hover na focus.

Phurayimari Xikolo xa vumbirhi Humelela Nghozi Xilemukisi Info Rivoni Xinyama

<a href="#" class="badge badge-primary">Primary</a>
<a href="#" class="badge badge-secondary">Secondary</a>
<a href="#" class="badge badge-success">Success</a>
<a href="#" class="badge badge-danger">Danger</a>
<a href="#" class="badge badge-warning">Warning</a>
<a href="#" class="badge badge-info">Info</a>
<a href="#" class="badge badge-light">Light</a>
<a href="#" class="badge badge-dark">Dark</a>