Selamat datang buat teman-teman dan terima kasih. Disini kita akan membahas bagaimana cara mengimplementasikan bootstrap ke dalam suatu website. Dengan menggunakan berbagai fitur atau properti class yang telah disediakan di dalam bootstrap baik itu CSS ataupun JavaScirptnya.
Pada pembahasan sebelumnya, kita diarahkan untuk mendownload Bootstrap, kemudian anda ekstrak file Bootstrap, yaitu bootstrap-3.3.7. Salin folder tersebut dan masukkan ke dalam folder proyek yangakan kita buat. Sebagai contoh, masukkan folder tersebut ke dalam direktori C:/xampp/htdoct/latihan. Susunan folder akan seperti gambar di bawah :
Untuk percobaan, anda buat dokumen HTML sederhana seperti gambar dibawah ini :
Jika anda tampilkan pada browser, hasilnya akan seperti gambar berikut :
Untuk percobaan, anda buat dokumen HTML sederhana seperti gambar dibawah ini :
| Baca juga artikel lainnya : |
Jika anda tampilkan pada browser, hasilnya akan seperti gambar berikut :
Anda panggil style CSS Bootstrap dan ketikkan '<link rel="stylesheet" href="assets/bootstrap/css/bootstrap.min.css">' diantara tag '<head> & </head>'. Jika susunan direktori dan markup HTML yang akan diketikkan benar, hasilnya akan seperti gambar di bawah :
Silahkan lanjutkan dengan materi selanjutnya :
Silahkan lanjutkan dengan materi selanjutnya :
- Grid pada Bootstrap
- Tipografi pada Bootstrap
- Penggunaan Bootstrap untuk Tabel
- Penggunaan Bootstrap untuk Form
- Penggunaan Bootstrap untuk Button
- Penggunaan Bootstrap untuk Image
- Helper Class dan Komponen Dasar Bootstrap
- Plugin JavaScript pada Bootstrap
| Artikel Terkait : |
Sekian artikel kali ini, silahkan lanjut ke materi selanjutnya dan budayakan berbagi dan semoga Bermanfaat ...