Badge ها برای نمایش اطلاعات کوچک مثل اعلان‌ها (Notification)، تعداد پیام‌ها یا برچسب وضعیت استفاده می‌شن.

📌 1. Badge ساده

<h1>مثال <span class="badge bg-secondary">جدید</span></h1>
<h2>مثال <span class="badge bg-success">فعال</span></h2>
<h3>مثال <span class="badge bg-danger">حذف</span></h3>

🔹 میشه هر Badge رو داخل هر تگی قرار داد.

📌 2. Badge روی دکمه

<button type="button" class="btn btn-primary">
  پیام‌ها <span class="badge bg-light text-dark">4</span>
</button>

🔹 نمایش تعداد اعلان روی دکمه.

📌 3. رنگ‌های مختلف Badge

<span class="badge bg-primary">Primary</span>
<span class="badge bg-success">Success</span>
<span class="badge bg-danger">Danger</span>
<span class="badge bg-warning text-dark">Warning</span>
<span class="badge bg-info text-dark">Info</span>
<span class="badge bg-dark">Dark</span>

📌 4. Pill Badges (نشان گرد)

<span class="badge rounded-pill bg-primary">Primary</span>
<span class="badge rounded-pill bg-success">Success</span>
<span class="badge rounded-pill bg-danger">Danger</span>

🔹 با کلاس rounded-pill Badge حالت گرد پیدا می‌کنه.

✨ خلاصه:

• badge → ایجاد نشان

• bg-* → رنگ پس‌زمینه

• rounded-pill → گرد شدن گوشه‌ها

• میشه داخل متن، دکمه یا هر عنصر دیگه استفاده کرد