Bootstrap 5 TutorialLesson 14Preview gratis
BS5 Badges
Lesson ini bagian dari Bootstrap · Semua level
Ringkasan
Badge adalah label kecil yang menampilkan angka atau kategori seperti jumlah notifikasi pada menu. Class dasarnya .badge dipadukan warna tema seperti .bg-primary atau .bg-success. Sejak Bootstrap 5.2, .text-bg-* memberi warna teks otomatis kontras dengan latar badge.
Poin kunci
- .badge adalah kelas dasar badge.
- Warna badge memakai .bg-* karena badge tidak lagi punya kelas khusus .badge-primary.
- .rounded-pill membuat badge berbentuk pil membulat.
- .text-bg-* mengatur teks otomatis kontras sejak v5.2.
- Badge sering ditempatkan di dalam tautan atau navbar sebagai penanda jumlah.
Materi lengkap
Contoh kode dan kuis
Materi lengkap, contoh kode, dan kuis tersedia untuk pelanggan. 5 soal.