Bootstrap | PENGGUNAAN BUTTON DROPDOWNS PADA BOOTSTRAP | Budayakan Berbagi
Untuk menambahkan dropdown ke tombol, anda wrap elemen button dan menu dropdown dengan <div class="btn-group"> … </div>. anda juga dapat menggunakan <span="caret"> … </span> untuk bertindak sebagai indikator bahwa button adalah sebuah dropdown.
Berikut ini adalah contoh markup HTML yang merupakan style dasar dari button group :
Beberapa button dropdown yang lain, seperti :
Bootstrap | PENGGUNAAN BUTTON GROUP PADA BOOTSTRAP | Budayakan Berbagi
Bootstrap juga menyediakan tiga class yang dapat anda gunakan untuk mengatur ukuran tombol, yaitu .btn-group-lg untuk ukuran besar, .btn-group-sm untuk ukuran kecil dan .btn-group-xs untuk ukuran sangat kecil.
Berikut ini adalah contoh Markup HTML untuk mengatur ukuran tombol grup :
Bootstrap | PENGGUNAAN BUTTON GROUP PADA BOOTSTRAP | Budayakan Berbagi
Anda dapat menempatkan button group ke dalam button group lain dengan menempatkan class .btn-group ke dalam class .btn-group lain, hal ini dilakukan jika anda ingin menu dropdown dicampur dengan serangkaian tombol. Berikut contoh markup HTML-nya:
Bootstrap | PENGGUNAAN BUTTON GROUP PADA BOOTSTRAP | Budayakan Berbagi
Class .btn-group-justified dapat membantu anda untuk membuat grup tombol membentang pada ukuran yang sama dengan rentang seluruh lebar induknya. Style ini juga berfungsi pada button dropdown di dalam kelompok tombol.
Bootstrap | PENGGUNAAN BUTTON GROUP PADA BOOTSTRAP | Budayakan Berbagi
Class .btn-group-vertical dapat membantu anda untuk membuat menu nutton dengan susunan vertical. Berikut ini adalah contoh markup HTML-nya :
Bootstrap | PENGGUNAAN BUTTON GROUP PADA BOOTSTRAP | Budayakan Berbagi
Style ini anda gunakan jika button berperan sebagai toolbar. Jika pada style dasar class yang anda gunakan adalah .btn-group, pada style ini, anda perlu menambahkan class .btn-toolbar sebagai induk dari class .btn-group. Sebagai contoh : <div class="btn-toolbar" role="toolbar"><div class="btn-group"> … </div></div>.
Berikut ini contoh markup HTML untuk membuat button group dengan style toolbar:
