Bootstrap 5 TutorialLesson 15Preview gratis
BS5 Progress Bars
Lesson ini bagian dari Bootstrap · Semua level
Ringkasan
Progress bar menampilkan progres penyelesaian tugas dalam bentuk bar horizontal berwarna. Elemen .progress menjadi wadah sedangkan .progress-bar di dalamnya menentukan lebar lewat atribut style width dalam persen. Tambahkan .progress-bar-striped dan .progress-bar-animated untuk efek bergaris bergerak.
Poin kunci
- .progress adalah wadah dan .progress-bar adalah isinya.
- Lebar progres diatur lewat atribut style width dalam persen.
- .progress-bar-striped menambahkan efek garis miring.
- .progress-bar-animated membuat garis bergerak dan biasanya dipasangkan dengan striped.
- Warna bar memakai utilitas .bg-* seperti .bg-success.
Materi lengkap
Contoh kode dan kuis
Materi lengkap, contoh kode, dan kuis tersedia untuk pelanggan. 5 soal.