Bootstrap 5 TutorialLesson 20Preview gratis
BS5 Dropdowns
Lesson ini bagian dari Bootstrap · Semua level
Ringkasan
Dropdown menampilkan menu tersembunyi yang muncul saat pengguna mengklik pemicunya. Pada Bootstrap 5, dropdown dibuat dengan atribut data-bs-toggle="dropdown" pada tombol, lalu menu ditulis dengan <ul class="dropdown-menu"> berisi <a class="dropdown-item">. Komponen ini membutuhkan file JavaScript bootstrap bundle.
Poin kunci
- Pemicu memakai data-bs-toggle="dropdown" dan berupa <button> atau <a>.
- Menu memakai ul.dropdown-menu dengan a.dropdown-item di dalamnya.
- Pemicu yang terbuka memperoleh kelas .show.
- Posisi menu diatur dengan .dropend, .dropstart, .dropup.
- Popper.js yang sudah termasuk bundle menjaga menu tetap di dalam viewport.
Materi lengkap
Contoh kode dan kuis
Materi lengkap, contoh kode, dan kuis tersedia untuk pelanggan. 5 soal.