Cara menggunakan Bootstrap secara offline untuk membuat tampilan website tanpa perlu menulis kode CSS secara manual.

Bootstrap merupakan sebuah framework CSS yang digunakan untuk membuat tampilan web. Bootstrap menyediakan class dan komponen yang siap untuk dipakai, sehingga Anda tidak perlu menulis kode CSS dari nol.

Misalnya Anda ingin membuat tombol, maka Anda tidak perlu membuatnya dari awal. Anda hanya perlu menambahkan class “btn” dan tombol Anda akan jadi dalam sekejap.

Awalnya Bootstrap dikembangkan oleh developer Twitter, dan pertama kali web yang menggunakan Bootstrap tentunya Twitter. Lalu, seiring perjalanan Bootstrap dibuat open source agar semua orang dapat berkontribusi di dalamnya.

Saat ini banyak developer website yang menggunakan Bootstrap. Mengapa? Karena jelas Bootstrap memiliki banyak kelebihan, diantaranya adalah dapat menghemat waktu, memiliki desain yang modern, tampilan yang sangat responsive, ringan, dan masih banyak lagi.

Cara Menggunakan Bootstrap Offline untuk Pemula

Lalu, bagaimana cara menggunakan Bootstrap untuk para pemula? Berikut ini langkah-langkah menggunakannya. Langsung saja ikuti langkah-langkah dibawah ini.

Daftar Isi

1. Mengunduh Bootstrap

1. Pertama, silahkan Anda buka web browser di PC ataupun laptop Anda. Lalu, silahkan Anda ketikkan https://getbootstrap.com/ atau langsung saja klik disini. Silahkan Anda klik Download, seperti yang ditunjukkan pada gambar dibawah ini.

2. Kemudian, Anda akan dibawa ke halaman berikutnya. Silahkan Anda klik tombol Download, seperti yang ditunujukkan pada gambar dibawah ini.

3. Tunggu beberapa saat sampai proses download selesai. Biasanya hanya sebentar saja karena ukurannya yang sangat kecil.

4. Lalu, lanjut ke langkah berikutnya.

2. Menggunakan Bootstrap

1. Setelah proses mengunduh selesai, Anda akan mendapatkan file Bootstrap yang berupa .rar.

2. Lalu, silahkan Anda buat folder baru di dalam htdocs, misalnya disini saya membuat folder baru dengan nama “belajarbootstrap”. Silahkan Anda pindahkan file .rar tadi ke dalam folder baru ini. Seperti pada gambar dibawah ini.

3. Lalu, silahkan Anda extract file tersebut. Seperti pada gambar dibawah ini.

4. Kemudian, silahkan Anda buka text editor di PC ataupun laptop Anda. Dan silahkan buka folder yang Anda buat tadi, misalnya disini folder saya yang tadi adalah “belajarbootstrap”.

5. Lalu, silahkan Anda buat file baru dengan nama index.html. Seperti pada gambar dibawah ini.

6. Lalu, silahkan Anda isi file tersebut dengan kode dibawah ini.

    
    
    

    
    
    
    




    
    

        

            

                

                    

                        
Welcome to My Web
                        
Aku sedang belajar Bootstrap 4

                    
                
            
        
    

7. Lalu, silahkan Anda coba jalankan di web browser. Tapi sebelumnya jangan lupa hidupkan XAMPP Anda. Jika berhasil, tampilan di browser Anda akan seperti gambar dibawah ini.

8. Selesai. Sekarang Anda sudah bisa menggunakan Bootstrap untuk web Anda.

Penjelasan:

Sebenarnya dalam menggunakan Bootstrap hal yang wajib digunakan adalah dua ini:

Tag berfungsi untuk menyisipkan atau menghubungkan file CSS bootstrap ke dalam dokumen HTML. Sedangkan tag

Reply 4 0 Chia sẻ