Boostrap Pager, Lists group, and Panels (RAS)

hai teman-teman, kali ini kita akan belajar bootstrap, mungkin beberapa dari kalian tidak tau apa itu bootstrap , boosstrap itu adalah suatu design css yang sudah jadi dan kita hanya menggunakan nya saja , semuanya lengkap dengan cara menggunakan class yang sudah ada.

nah kali ini saya akan membahas bagian pager, apa itu pager? Pager juga merupakan bentuk pagination (seperti yang dijelaskan dalam materi sebelumnya).Pager menyediakan tombol sebelumnya dan berikutnya (link).Untuk membuat tombol sebelumnya / berikutnya, menambahkan kelas .pager ke <ul> elemen, contohnya :

nah seperti ini saja, kita hanya cukup memanggil classnya , "pager" itu nama classnya , maka outputnya adalah : 

mungkin teman-teman sekalian mencobanya tidak bisa atau tidak sama dengan hasil nya diatas. ini karena teman-teman sekalian harus memiliki file bootstrap terlebih dahalu. teman-teman bisa di download file nya, isi filenya itu berupa css dan bisa mencapai 6000 line, dan itu lengkap semua.

terus agar bisa digunakan teman-teman gunakan tag <link> dan href kan atau tujukan ke file yang telah di donwload tadi.

nah lanjut, jika teman-teman masih tidak puas dengan hasil diatas, ataupun tidak menarik di web kalian , kalian bisa ubah nya menjadi jarak seperti ini : 

nah teman-teman hanya menambahkan namanya saja seperti ini :

kemudian list group, apa itu list group ? seperti namanya list group ini akan mengelompokan data data dalam bentuk list. contohnya :

maka hanya dengan memanggil class akan menjadi seperti itu , class nya yaitu : 

contoh lain : jika heading nya ingin berwarna agar mudah untuk membedakan mana isi mana heading, maka hanya perlu membuatnya menjadi active pada classnya 

contoh lain : jika heading nya tidak bisa ditekan, atau dilarang atau tidak bisa edit , bisa mengdisable kan classnya : 

contoh lain : jika headingnya atau isinya ingin penuh warna bisa menggunakan warna di bawah 

jika ingin berwarna tidak bisa asal menambahkan sesuai dengan warna , misalnya warna pink , maka classnya di tambahkan pink, itu tidak bisa , maka harus disesuaikan : 

kemudian ada bagian Panels, panels adalah beberapa kotak dengan border dengan beberapa padding. 

contohnya  : 

outputnya : ini basicnya saja

contoh lain : heading

makan hanya di ubah clsasnya menjadi : 

contoh lain : jika footer bagian penting

classnya di ubah menjadi : 

oke itu saja yang bisa saya berikan , buat teman-teman yang ingin jago boostrap teman-teman harus sering coding , dan belajar  ,dan jangan lupa coba , karena jika teman-teman sering memakai boostrap maka teman-teman akan terbiasa dan menjadi bisa design dengan sempurna dan ini hanya bagian kecil , selebihnya kalian bisa liat artikel lain nya :) terima kasih 

>> Thank for W3School.com <<