Mungkin anda semua sudah banyak yang mengetahui dengan yang namanya Framework. Framework adalah sebuah kerangka kerja yang digunakan untuk mengembangkan website. Framework ini diciptakan untuk membantu web developer dalam menulis baris kode. Dengan menggunakan framework penulisan kode akan jauh lebih mudah, cepat, dan terstruktur rapi.

Dari sekian banyaknya framework yang ada salahsatunya yaitu Bootstrap saat ini Bootstrap sudah banyak berkembang. Tahukah anda bahwa saat ini Bootstrap sekarang ini sudah sampai kepada versi ke-5 dari Bootstrap.

Di Bootstrap kita banyak dimudahkan dengan adanya nama-nama clas yang memudahkan kita dalam melakukan percodingan. Salaha satunya dalam membuat navbar yang sudah memiliki fitur Responsive.

Akan tetapi sangat banyak orang yang tidak tahu bagaimana cara membuat Navbar yang memiliki fitur Drop down Menu.

Nah, kali ini kita akan belajar tentang cara membuat Drop down menu di Bootstrap.

Berikut ini adalah cara untuk menggunakan Bootstrap versi 5.2 !

  1. Cara pertama yaitu kita harus membuka website resmi bootstrap. Untuk masuk kedalam website resminya silahkan klik link berikut.
  2. Lalu Jika tampilannya sudah seperti ini silahkan klik Menu Docs untuk mendownload filenya.

3. Jika sudah masuk ke dalam Docs. Maka Silahkan cari yang namanya Introduction lalu cari yang seperti ini jika anda ingin menggunakan Bootstrap secara online.

4. Lalu Copy dan pindahkan kedalam file text-editor anda

5. Jika anda ingin menggunakan Bootstrap secara offline, maka anda harus mendownload filenya terlebih dahulu.

6. Jika anda sudah selesai mendownloadnya maka anda harus mengextract file RAR tersebut.

7. Jika sudah selesai di extract maka anda harus mengambil file css dan Java Scriptnya agar dapat digunakan.

8. Setelah itu anda harus meletakkannya di folder yang sudah anda siap sebelumnya untuk melakukan percodingan.

9. Setelah itu kita hanya harus melakukan pemanggilan pada file css dan Java Script nya seperti anda memanggil file seperti biasanya.

10. Dan ingat yang harus di panggil seringnya adalah file : css/bootstrap.min.css dan js/bootstrap.min.js Seperti di bawah ini

11. Setelah itu anda hanya harus melakukan pemanggilan masing-masing class yang sudah memiliki fungsi masing-masing dan anda juga bisa mencopy-paste dari website resminya saja.

12. Buka Website Bootstrap dan pilih menu Docs,

This image has an empty alt attribute; its file name is Screenshot-25-1024x576.png

13. Lalu, cari navbar di dalam Docs tersebut,

14. Dan pilih jenis navbar yang seperti ini,

15. lalu Copy semua code didalamnya dan pindahkan kedalam text editor anda,

Nindya

Kamu Mau, Kamu Pasti Bisa

http://web.dhuocreative.com
X