Tutorial Bootstrap Part 16: Dropdown
Oke pada kesempatan kali ini rekayasaternaklele akan membahas tentang Dropdown pada Bootstrap.
Judul
Tutorial Bootstrap Part 16: Dropdown
Pengertian
Menurut Wikipedia, Bootstrap adalah sebuah alat bantu untuk membuat sebuah tampilan halaman website yang dapat mempercepat pekerjaan seorang pengembang website ataupun pendesain halaman website. Sesuai namanya, website yang dibuat dengan alat bantu ini memiliki tampilan halaman yang sama / mirip dengan tampilan halaman Twitter atau desainer juga dapat mengubah tampilan halaman website sesuai dengan kebutuhan.
Latar Belakang
Mencari kemudahan dalam membuat front-end website yang cepat,responsive dan praktis sehingga kita tidak perlu menulis kode CSS dari nol.
Maksud dan Tujuan
Memahami dan bisa menggunakan Bootsrap sehingga pengembangan fron end website lebih efektif dan efisien.
Alat dan Bahan
Text Editor dan PC
Jangka Waktu
1 Jam
Pembahasan
Dropdown adalah menu toggleable yang memungkinkan pengguna untuk memilih salah satu nilai dari daftar yang tersedia.
Contoh :
Keterangan :
- Class dropdown menunjukkan menu dropdown
- Untuk membuka menu dropdown, gunakan tombol atau link dengan class .dropdown-toggle dan atribut data-toggle="dropdown"
- Class .dropdown-menu digunakan untuk sebuah elemen <div> yang berguna menampung link dropdwon
- Class .dropdown-item untuk setiap elemen (link atau tombol) dalam menu dropdown
- Class .dropdown-divider digunakan untuk memisahkan link dropdown dengan garis horisontal tipis.
Class .dropdown-header digunakan untuk menambahkan header dalam menu dropdown. Contoh:
DropUp
Untuk membuat dropdown ke atas.
Contoh :
Kesimpulan
Referensi
https://www.w3schools.com/bootstrap4/bootstrap_dropdowns.asp
Dropdown adalah menu toggleable yang memungkinkan pengguna untuk memilih salah satu nilai dari daftar yang tersedia.
Referensi
0 Response to "Tutorial Bootstrap Part 16: Dropdown"
Post a Comment