Badge dɛn we dɛn kin yuz

Dokumɛnt ɛn ɛgzampul fɔ badge, wi smɔl kɔnt ɛn lɛbul kɔmpɔnɛnt.

Ɛgzampul

Badge dɛn de skel fɔ mach di sayz fɔ di immediate parent element bay we dɛn de yuz rilitiv font saiz ɛn emyunit dɛn.

Ɛgzampul edlaynNyu

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

Yu kin yuz badge as pat pan link ɔ bɔtin fɔ gi kɔnta.

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

Notis se dipen pan aw dɛn de yuz dɛn, badge dɛn kin kɔnfyus fɔ di wan dɛn we de yuz skrin rida ɛn dɛn kayn ɛp tɛknɔlɔji dɛn ya. Pan ɔl we di stayl we dɛn mek fɔ di badge dɛn de mek dɛn ebul fɔ si wetin dɛn want fɔ du, dɛn go jɔs sho dɛn wan dɛn ya we de yuz am di tin dɛn we de insay di badge. Dipen pan di patikyula tin we de apin, dɛn badge dɛn ya kin tan lɛk ɔda wɔd dɛn ɔ nɔmba dɛn we dɛn kin put na di ɛnd pan wan sɛntɛns, link, ɔ bɔtin.

If di kɔntɛks nɔ klia (lɛk di ɛgzampul we se “Notis dɛn,” usay dɛn ɔndastand se di “4” na di nɔmba fɔ di notis dɛn), tink bɔt fɔ put ɔda kɔntɛks wit ɔda tɛks we dɛn ayd wit yu yay.

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

Di difrɛn difrɛn tin dɛn we de apin na di kɔntɛks

Ad ɛni wan pan di modifya klas dɛn we wi dɔn tɔk bɔt dɔŋ ya fɔ chenj di we aw wan badge de luk.

Fɔs Sɛkɔndari Go bifo Denja Wɔnin Info Layt Dak

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

Fɔ gi minin to ɛtɛknɔlɔji dɛn we de ɛp

Yuz kala fɔ ad minin de jɔs gi wan vijual indikashɔn, we dɛn nɔ go gi to di wan dɛn we de yuz ɛtɛknɔlɔji dɛn we de ɛp – lɛk skrin rida dɛn. Mek shɔ se di infɔmeshɔn we dɛn sho wit di kɔlɔ de sho klia wan frɔm di tin we de insay insɛf (ɛgz. di tɛks we yu de si), ɔ dɛn put am insay ɔda we dɛn, lɛk ɔda tɛks we dɛn ayd wit di .sr-onlyklas.

Pil badge dɛn

Yuz di .badge-pillmodifya klas fɔ mek badge dɛn rawnd mɔ (wit wan big border-radiusɛn ɔda ɔrizɔntal padding). Yusful if yu mis di badges frɔm v3.

Fɔs Sɛkɔndari Go bifo Denja Wɔnin Info Layt Dak

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

Links dɛn

Yuz di kɔntɛkstual .badge-*klas dɛn pan wan <a>ɛlimɛnt kwik kwik wan de gi akshɔnable badge dɛn wit hova ɛn fɔs stet dɛn.

Fɔs Sɛkɔndari Go bifo Denja Wɔnin Info Layt Dak

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