Tutorial Membuat Tampilan Tabel Menjadi Menarik Dengan Bootstrap

Transkripsi

1 Tutorial Membuat Tampilan Tabel Menjadi Menarik Dengan Bootstrap Muhammad Dede Soleman Abstrak Dalam sisi programming kita dituntut untuk membuat sebuah program semenarik mungkin agar dapat dilihat oleh client lebih menarik dan dapat mengambil banyak minat dari seorang client. Dalam hal ini saya mengenalkan system bootstrap dalam mengambil alih tampilan pada table. Kata Kunci: Programming, Bootstrap, Tabel Pendahuluan Bootstrap adalah sebuah library framework CSS yang dibuat khusus untuk bagian pengembangan front-end website. Agar website yang kita buat dapat responsive, sehingga halaman web yang kita buat dapat menarik dan enak dilihat. Dulu bootstrap disebut dengan nama Twitter Blueprint yang dikembankan oleh Mark Otto dan Jacob Thornton di Twitter sebagai kerangka kerja untuk mendorong konsistensi di alat internal. Dalam hal ini saya akan mencoba bootstrap dalam menampilkan table pada website yang saya buat.

2 Pembahasan Perangkat atau alat yang diperlukan : 1. PC. 2. Library Bootstrap. 3. Segelas kopi. :D Yuk mari kita lakukan pembuatannya. 1. Siapkan sebuah coding table pada sebuah script. Dan simpan koding tersebut dengan nama table.php.

3 2. Hasil dari koding tersebut sebelum diberi bootstrap. 3. Kemudian saya akan memberikan sebuah sentuhan bootstrap pada table tersebut. - Pertama download dahulu frameworknya bootstrap. Dari link ini - Dan akan mendapatkan sebuah file zip dengan nama bootstrap alpha.6-dist.zip. - Kemudian ekstrak file dan tempatkan file didalam folder yang dibuat untuk websitenya.

4 Kurang lebih seperti itu. Lalu cara untuk pemanggilan atau penggunannya ada sebagai berikut. - Gunakan perintah ini untuk menyambungkannya - Lalu tambahkan kodingnya sebagai berikut.

5

6 Ualaaa. Begini hasilnya. Jika pointer mouse kita arahkan ke salah satu table maka table akan merespon merubah warnanya seperti berikut.

7 Dalam gambar saya mengarahkan pointer ke tengah dan otomatis berubah menjadi abu abu gelap. - Selesai. Penutup Cukup sekian dari saya pembelajaran tentang menggunakan bootstrap terhadap table agar lebih responsive terhadap sebuah gerakan pointer kea rah table. Semoga para pembaca dapat mengerti apa yang saya jelaskan disini. Tujuan saya membuat artikel ini agar pembaca dapat membuat sebuah tampilan pada table lebih efisien dan trendi. Terima kasih dari saya jika terjadi kesalahan mohon di maklumi :D. Referensi( PENGALAMAN PRIBADI ) Biografi Nama saya Muhammad Dede Soleman, kelahiran Tegal, 09 Juni cita cita saya menjadi ahli dalam bidang networking. Saya sangat menyukai pembahasan dalam bidang network, karna menurut saya dalam bidang network itu mengasikkan dapat jalan jalan sekaligus berkerja apa lagi kalau tempat berkerjanya jauh, bisa sekalian refreshing sehingga tidak stress setelah bekerja. Kedepannya saya harap bisa berkontribusi dalam bidang networking untuk Indonesi. Ketinggian yak tapi tidak apa apa, namanya juga harapan harus yang tinggi :D. jika ada pertanyaan atau kesalahan dalam menulis dari saya bisa hubungi WA/Telpon : atau Muhammad.dede@raharja.info

8