Source

نیشانەکان

بەڵگەنامە و نموونە بۆ نیشانەکان، پێکهاتەی ژماردنی بچووک و ناونانی ئێمە.

نموونە

نیشانەکان پێوانە دەکەن بۆ ئەوەی لەگەڵ قەبارەی توخمە باوکی دەستبەجێدا بگونجێت بە بەکارهێنانی قەبارەی فۆنت و 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>