برجونه
د بیجونو لپاره اسناد او مثالونه، زموږ کوچنۍ شمیره او د لیبل کولو برخه.
emد بیجونو اندازه د اړونده فونټ اندازه کولو او واحدونو په کارولو سره د سمدستي اصلي عنصر اندازې سره سمون لپاره .
<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>بیجونه د کاونټر چمتو کولو لپاره د لینکونو یا بټونو برخې په توګه کارول کیدی شي.
<button type="button" class="btn btn-primary">
Notifications <span class="badge badge-light">4</span>
</button>په یاد ولرئ چې د دوی کارولو څرنګوالي پورې اړه لري، بیجونه ممکن د سکرین لوستونکو او ورته مرستندویه ټیکنالوژیو کاروونکو لپاره مغشوش وي. پداسې حال کې چې د بیجونو سټایل د دوی هدف په توګه یو بصری اشاره چمتو کوي، دا کاروونکي به په ساده ډول د بیج مینځپانګې سره وړاندې شي. په ځانګړي حالت پورې اړه لري، دا بیجونه ممکن د جملې، لینک، یا تڼۍ په پای کې د تصادفي اضافي کلمو یا شمیرو په څیر ښکاري.
پرته لدې چې شرایط روښانه وي (لکه څنګه چې د "اطلاعاتو" مثال سره ، چیرې چې دا پوهیږي چې "4" د خبرتیاو شمیر دی) ، د اضافي متن د لید پټې برخې سره اضافي شرایط په پام کې ونیسئ.
<button type="button" class="btn btn-primary">
Profile <span class="badge badge-light">9</span>
<span class="sr-only">unread messages</span>
</button>د بیج بڼه بدلولو لپاره لاندې ذکر شوي ترمیم کونکي ټولګي شامل کړئ.
<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>مرستندویه ټیکنالوژیو ته د معنی رسول
د معنی اضافه کولو لپاره د رنګ کارول یوازې یو بصری نښې وړاندې کوي، کوم چې به د مرستندویه ټیکنالوژیو کاروونکو ته نه لیږل کیږي - لکه د سکرین لوستونکي. ډاډ ترلاسه کړئ چې د رنګ لخوا څرګند شوي معلومات یا پخپله د مینځپانګې څخه څرګند دي (د بیلګې په توګه څرګند متن) ، یا د بدیل وسیلو له لارې شامل شوي ، لکه د .sr-onlyټولګي سره پټ اضافي متن.
د تعدیل کونکي ټولګي څخه کار واخلئ .badge-pillترڅو بیجونه ډیر ګردي کړئ (د لوی border-radiusاو اضافي افقی سره padding). ګټور که تاسو د v3 څخه بیجونه له لاسه ورکړئ.
<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>په یو عنصر کې د متناسب .badge-*ټولګیو کارول په چټکۍ سره د هور او تمرکز حالتونو سره د عمل وړ بیجونه چمتو کوي.<a>
<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>