Button
button atau tombol bisa di buat dalam element <button>, <a href...>, <input> (komponen lain mungkin juga bisa)
cara menggunakannya sederhana saja, kita cukup menambahkan class di dalamnya, contoh:
class="btn"
itu sudah cukup untuk membuat tombol, tetapi tersedit juga berbagai macam jenis tombol (warna) di bootstrap ini seperti primary, info, danger, warning dan success. Caranya sama, yaitu menambahkan class lagi, contoh:
class="btn btn-info", ini untuk tombol info. Juga berlaku untuk jenis tombol lainnya seperti: btn-warning, btn-success, btn-primary, btn-danger.
class="btn btn-info", ini untuk tombol info. Juga berlaku untuk jenis tombol lainnya seperti: btn-warning, btn-success, btn-primary, btn-danger.
Button Group
Tombol grup juga telah di sediakan oleh bootstrap, cara menggunakannya sangat mudah, yaitu menambahkan div dan menambahkan class "btn-group" didalam div tersebut.
Button Size
Ukuran tombol juga bisa kita sesuaikan, di bootstrap ini tersedia ukuran tombol mini, lihat di bawah ini:
Alert
Alert sendiri sebenarnya sama saja, kita cukup menambahkan class di dalam element div. Lihat contoh di bawah:
Icon
Nah, icon ini salahsatu kesukaan saya. Karena di bootstrap ini terbilang cukup lengkap dalam memberikan pilihan icon. Nah cara menggunakannya kita bisa menggunakan element , lihat contoh di bawah:
Nah, icon ini salahsatu kesukaan saya. Karena di bootstrap ini terbilang cukup lengkap dalam memberikan pilihan icon. Nah cara menggunakannya kita bisa menggunakan element , lihat contoh di bawah:
Nah, jika background di icon tersebut dominan di warna gelap, bootstrap telah memberikan alternatif icon berwarna putih. Anda cukup menambahkan class "icon-white" saja, sederhana bukan?
Sebenarnya bootstrap menyediakan dokumentasi lengkap tentang penggunaan bootstrap itu sendiri. Tunggu apa lagi, silahkan download dan maksimalkan waktu ngoding Anda! Happy Ngoprek!
Siapa yang belum mengenal bootstrap? sedikit penjelasan dari saya, bootstrap adalah sebuah css framework yang di design untuk css3 dan html5...
No comments explore bootstrap yuk!
Post a Comment