1 2 [SANGAT MUDAH] Cara Membuat Tab dengan Bootstrap Oleh: Arinadi Nur Rohmad Asalamualaikum.. Bagi yang seorang yang belum paham betul JQuery seperti...
[SANGAT MUDAH] Cara Membuat Tab dengan Bootstrap Oleh: Arinadi Nur Rohmad
Asalamualaikum.. Bagi yang seorang yang belum paham betul JQuery seperti saya, membuat Tab adalah pekerjaan yang cukup sulit.. Tapi Syukurlah, Karena Bootstrap memberikan banyak kemudahan dalam bisang Web Design diantaranya kemudahan untuk membuat Tab.. Apa itu Tab? Coba lihat bagian atas Browser anda.. Inilah Tab.. ...
Asalamualaikum.. Bagi yang seorang yang belum paham betul JQuery seperti saya, membuat Tab adalah pekerjaan yang cukup sulit.. Tapi Syukurlah, Karena Bootstrap memberikan banyak kemudahan dalam bisang Web Design diantaranya kemudahan untuk membuat Tab.. Apa itu Tab? Coba lihat bagian atas Browser anda.. Inilah Tab..
Ya, tapi sekarang kita akan membuat Tab untuk website agar tampilan website lebih rapi dan cantik.. Nah, sekarang saya ingin memberikan tutorial “Cara Membuat Tab dengan Bootstrap”. Kenapa harus dengan Bootstrap? Karena untuk memudahkan membuat tap hanya dengan class CSS saja tanpa perlu mengerti jQuery.. Sekarang kita mulai tutorialnya.. Siapkan Alat dan Bahanya.. 1. 2. 3. 4. 5.
Laptop atau benda sejenisnya. Browser. Text editor. Jquery. Versi 1.7 keatas, bias di download di situs resminya.. Bootstrap 3. Saya disini menggunakan Bootstrap v.3..
Jika semua sudah terkumpul saatnya saya mulai..
Langkah 1 Niat.. *Ini Penting..
Langkah 2 Nyalakan Laptop atau benda sejenisnya.. Buka Text editor..
Langkah 3 Buat folder , terserah dimana saja. Misal D: coba.. Lalu buat folder baru di dalamnya untuk wadah file bootstapnya, misal bootstap. Sekarang kita extrak bootstrap 3 yang sudah ada.. Seperti ini..
Hasil struktur Foldernya jadi seperti ini.. coba >bootstrap >>css >>fonts >>js
Langkah 4 Sekarang kita letakan jQuery.min.js di coba>bootstrap>js.. Seperti ini..
Langkah 5 Sekarang kita mulai coding.. Buat dulu code struktur dasar untuk bootstrap.. Patekan Code ini ke text editor kamu..
Langkah 6 Sekarang kita akan membuat beberapa tab, Coba lihat betapa mudahnya membuat tab dengan Bootstrap Pastekan code ini di antara Content Start dan END, fungsi dari barisan code sudah ada di Komentar
Lalu save file ini dengan nama index.html di folder coba..
Langkah 7 Buka index.html tadi.. Open with Browser anda.. Hasilnya..
Selesai..
Untuk mendapat update tutorial dari saya, silahkan click tombol “Follow” dibawah Foto saya di atas.. Original Posted By : Arinadi Nur Rohmad
Tentang Penulis Arinadi Nur Rohmad Code_Start(); Barisan Kata Untuk Aksi Nyata. Code_get_SUCCESS(); :) Sekolah di SMK YAPPI Wonosari, Yogyakarta. Jurusan RPL..
