Assalamu'alaikum W. W.
Abdul Hafid Gunawan - Hai Sobat setia SC Blog bertemu lagi dengan saya di Blog milik kita bersama, kali ini saya akan melanjutkan Tutorial Bootstrap Part 10. Dan langsung saja.
PENGERTIAN
SleepingCodings - Button Groups ialah sebuah button yang di dalam satu barisan yang sama mempunyai banyak button ( seperti Navigasi ).
LATAR BELAKANG
Untuk mempersingkat waktu dalam pembuatan front-end website, yang mempunyai prioritas responsive & praktis.
MAKSUD DAN TUJUAN
- Mampu menguasai, memahami dan menggunakan Bootstrap untuk mengembangkan skill Front-end Website.
- Agar lebih mudah membuat sebuah Button Groups.
- Agar lebih mudah membuat sebuah Button Groups.
ALAT DAN BAHAN
Text Editor
PEMBAHASAN
Default Button Groups merupakan Button Groups yang cara menggunakannya kita tinggal memanggil Classnya yaitu .btn .btn group seperti gambar di bawah ini :
2. Vertical Button Groups
Vertikal Button Groups merupakan Button Groups yang memiliki posisi Vertikal yaitu dari atas ke bawah dan cara memanggilnya yaitu .btn-group-vertical, seperti gambar di bawah ini :
3. Nesting Button Groups & Dropdown Menus
Nesting Button Groups & Dropdown Menus merupakan sebuah Class Button Groups di Bootstrap untuk membuat sebuah Dropdown Menu menggunakan Button Groups, conton penerapannya :
4. Split Button Dropdowns
Split Button Dropdowns merupakan sebuah Class di Bootstrap dimana Tombol Button di pisahkan dengan Tombol Dropdownsnya, contoh penerapannya :
KESIMPULAN
Button Groups lebih memudahkan kita dalam pembuatan Group Button, dan untuk membuat Dropdown. Kita tidak memerlukan tenaga extra untuk mengedit cssnya mulai dari awal, kita hanya perlu memanggil Class" yang telah di sediakan oleh Bootstrap.
REFERENSI
- http://www.w3schools.com/bootstrap4/bootstrap_button_groups.html
No comments:
Post a Comment