Bootstrap adalah kerangka kerja HTML, CSS, dan JavaScript yang populer digunakan untuk membangun tampilan website yang responsif dan menarik. Dikembangkan oleh tim Twitter, Bootstrap telah menjadi salah satu alat yang sangat penting bagi para pengembang web di seluruh dunia.
Dalam artikel ini, kami akan memberikan panduan lengkap tentang Bootstrap, mulai dari pengertian dasar hingga penggunaan yang lebih lanjut. Kami akan membahas fitur-fitur utama, struktur dasar, dan beberapa komponen kunci yang perlu Anda ketahui. Dengan pengetahuan yang kami berikan, Anda akan dapat dengan mudah memulai pengembangan website menggunakan Bootstrap.
Pengertian dan Sejarah Bootstrap
Pada sesi ini, kami akan menjelaskan secara mendalam tentang apa itu Bootstrap dan bagaimana sejarahnya. Bootstrap adalah kerangka kerja open-source yang pertama kali dirilis pada tahun 2011 oleh Mark Otto dan Jacob Thornton dari Twitter. Tujuan utama Bootstrap adalah menyederhanakan proses pengembangan website dengan menyediakan kumpulan komponen dan gaya siap pakai yang dapat digunakan dengan mudah.
Seiring waktu, Bootstrap berkembang menjadi salah satu kerangka kerja paling populer di dunia. Banyak pengembang web memilih Bootstrap karena kemampuannya dalam mempercepat proses pengembangan, membuat tampilan website responsif, dan menyederhanakan pengelolaan kode. Bootstrap juga terus diperbarui dan ditingkatkan oleh komunitas pengembang yang aktif, sehingga tetap relevan dan up-to-date dengan perkembangan teknologi web terbaru.
Sejarah Bootstrap
Bootstrap pertama kali dirilis sebagai proyek internal Twitter pada tahun 2010. Pada saat itu, tim pengembang Twitter memiliki kesulitan dalam membangun konsistensi dan tampilan yang responsif di seluruh situs web mereka. Untuk mengatasi masalah ini, Mark Otto dan Jacob Thornton mulai mengembangkan kerangka kerja internal yang mereka sebut “Twitter Blueprint”.
Setelah beberapa waktu, Twitter Blueprint diubah namanya menjadi Bootstrap dan dirilis sebagai proyek open-source pada tahun 2011. Penerimaan terhadap Bootstrap sangat positif, dan kerangka kerja ini segera mendapatkan popularitas yang luas di kalangan pengembang web. Dalam beberapa tahun, Bootstrap telah mengalami beberapa pembaruan besar, termasuk pembaruan ke versi 2 pada tahun 2012 dan versi 3 pada tahun 2013.
Pada tahun 2015, Bootstrap merilis versi 4 yang merupakan pembaruan besar-besaran dengan peningkatan fitur dan peningkatan kinerja. Versi Bootstrap terbaru saat ini adalah versi 5, yang dirilis pada tahun 2021. Bootstrap 5 menawarkan lebih banyak fitur baru, peningkatan performa, dan dukungan yang lebih baik untuk pengembangan website modern.
Keunggulan Menggunakan Bootstrap
Di sesi ini, Anda akan mengetahui mengapa Bootstrap menjadi pilihan yang baik untuk pengembangan website Anda. Bootstrap menawarkan sejumlah keunggulan yang membuatnya menjadi kerangka kerja yang sangat efisien dan efektif. Beberapa keunggulan utama Bootstrap adalah:
Responsif dan Mobile-Friendly
Bootstrap dirancang dengan prinsip responsif, yang berarti tampilan website yang dibangun dengan menggunakan Bootstrap akan menyesuaikan diri dengan berbagai ukuran layar. Dengan menggunakan grid sistem responsif Bootstrap, Anda dapat dengan mudah mengatur tampilan website agar tampak sempurna di berbagai perangkat, mulai dari desktop hingga smartphone.
Keunggulan responsif Bootstrap ini sangat penting mengingat semakin banyak pengguna yang mengakses website melalui perangkat mobile. Dengan menggunakan Bootstrap, Anda dapat memastikan pengalaman pengguna yang baik dan konsisten, tanpa harus menghabiskan waktu dan usaha ekstra dalam membangun tampilan responsif secara manual.
Komponen dan Gaya Siap Pakai
Bootstrap menyediakan kumpulan komponen dan gaya siap pakai yang dapat Anda gunakan untuk membangun tampilan website dengan cepat dan mudah. Komponen-komponen ini mencakup tombol, formulir, navigasi, jumbotron, tooltip, dan banyak lagi. Anda dapat memilih dan menggabungkan komponen-komponen ini sesuai kebutuhan Anda, tanpa harus membuat dari awal setiap kali.
Keunggulan ini sangat berguna terutama jika Anda memiliki batasan waktu atau keterampilan desain yang terbatas. Dengan menggunakan komponen-komponen Bootstrap, Anda dapat dengan mudah menciptakan tampilan website yang menarik dan profesional tanpa harus memikirkan detail desain yang rumit.
Dokumentasi yang Komprehensif
Bootstrap menyediakan dokumentasi yang sangat komprehensif yang memandu Anda langkah demi langkah dalam penggunaan kerangka kerja ini. Dokumentasi Bootstrap mencakup penjelasan tentang setiap komponen, gaya, dan fitur yang disediakan, serta contoh penggunaan dan petunjuk penggunaan yang jelas.
Keunggulan dokumentasi yang komprehensif ini sangat membantu, terutama bagi pemula yang baru mengenal Bootstrap. Anda dapat dengan mudah mempelajari dan memahami cara menggunakan setiap fitur Bootstrap dengan bantuan dokumentasi ini, sehingga mempercepat proses pembelajaran dan pengembangan website Anda.
Memulai dengan Bootstrap
Langkah pertama dalam menggunakan Bootstrap adalah memahami cara memulainya. Pada sesi ini, kami akan membahas langkah-langkah dasar untuk memulai pengembangan website dengan Bootstrap. Kami juga akan memberikan panduan instalasi dan pengaturan awal yang diperlukan.
Instalasi Bootstrap
Langkah pertama untuk memulai dengan Bootstrap adalah mengunduh dan menginstalnya. Anda dapat mengunduh Bootstrap dari situs resminya di getbootstrap.com. Setelah Anda mengunduh file ZIP Bootstrap, ekstrak file tersebut ke dalam folder proyek Anda.
Setelah Anda menginstal Bootstrap, Anda dapat menggunakan file CSS dan JavaScript Bootstrap di halaman HTML Anda. Anda dapat menambahkan tautan ke file CSS Bootstrap di bagian head dokumen HTML Anda dengan menggunakan elemen <link> seperti ini:
<link rel="stylesheet" href="path/to/bootstrap.css">
Anda juga perlu menambahkan file JavaScript Bootstrap di bagian akhir dokumen HTML Anda sebelum tag penutup </body> dengan menggunakan elemen <script> seperti ini:
<script src="path/to/bootstrap.js"></script>
Setelah Anda menambahkan file CSS dan JavaScript Bootstrap, Anda siap memulai pengembangan website dengan Bootstrap.
Struktur Dasar Bootstrap
Untuk memahami Bootstrap dengan baik, penting untuk mempelajari struktur dasarnya. Di sesi ini, kami akan menjelaskan struktur dasar Bootstrap, termasuk penggunaan kontainer, grid sistem, dan komponen utama lainnya.
Kontainer
Kontainer adalah wadah utama tempat Anda menempatkan konten website Anda. Dalam Bootstrap, ada dua jenis kontainer yang tersedia: kontainer biasa dan kontainer-fluid. Kontainer biasa memiliki lebar terbatas dan akan berada di tengah halaman, sedangkan kontainer-fluid akan mengisi seluruh lebar layar.
Anda dapat membuat kontainer menggunakan elemen <div> dengan memberikan kelas .container atau .container-fluid. Berikut adalah contoh penggunaan kontainer biasa:
<div class="container"></div>
Berikut adalah contoh penggunaan kontainer-fluid:
<div class="container-fluid"></div>
Dengan menggunakan kontainer, Anda dapat mengatur tata letak dan lebar konten website Anda dengan lebih mudah.
Grid sistem adalah salah satu fitur utama Bootstrap yang memungkinkan Anda untuk membagi tata letak halaman menjadi kolom-kolom yang responsif. Grid sistem terdiri dari 12 kolom, yang dapat Anda bagi sesuai kebutuhan Anda. Dengan menggunakan grid sistem Bootstrap, Anda dapat dengan mudah mengatur posisi dan ukuran elemen-elemen dalam halaman. Untuk menggunakan grid sistem, Anda perlu memasukkan elemen-elemen dalam elemen dengan kelas Sebagai contoh, jika Anda ingin membagi halaman menjadi dua kolom yang sama lebar, Anda dapat menggunakan kelas Dalam contoh di atas, kedua kolom akan memiliki lebar yang sama dan akan menempati setengah lebar halaman masing-masing. Anda juga dapat menggunakan kelas seperti Bootstrap menyediakan berbagai komponen utama yang dapat Anda gunakan untuk memperkaya tampilan website Anda. Beberapa komponen utama yang disediakan oleh Bootstrap antara lain: Tombol adalah salah satu komponen yang paling sering digunakan dalam pengembangan website. Dalam Bootstrap, Anda dapat dengan mudah membuat tombol dengan memberikan kelas Bootstrap menyediakan kumpulan komponen formulir yang siap pakai, seperti input, textarea, checkbox, radio button, dan lainnya. Anda dapat menggunakan kelas-kelas yang disediakan oleh Bootstrap untuk mengatur tampilan dan perilaku formulir Anda. Bootstrap menyediakan komponen navigasi yang memudahkan Anda dalam membuat menu navigasi website. Anda dapat menggunakan kelas Jumbotron adalah komponen yang digunakan untuk menyoroti pesan penting atau konten utama di halaman website. Dalam Bootstrap, Anda dapat dengan mudah membuat jumbotron dengan memberikan kelas Tooltip adalah komponen yang digunakan untuk menampilkan informasi tambahan ketika pengguna mengarahkan kursor ke elemen tertentu. Dalam Bootstrap, Anda dapat dengan mudah menambahkan tooltip menggunakan atribut Di atas adalah beberapa contoh komponen utama yang disediakan oleh Bootstrap. Namun, Bootstrap menyediakan banyak komponen lainnya seperti carousel, modal, card, dan lainnya. Anda dapat melihat dokumentasi resmi Bootstrap untuk mempelajari lebih lanjut tentang komponen-komponen tersebut. Responsif adalah salah satu fitur utama dari Bootstrap. Di sesi ini, Anda akan belajar bagaimana membuat tampilan website yang responsif dengan menggunakan fitur-fitur Bootstrap yang tersedia. Salah satu cara paling umum untuk membuat tampilan website responsif dengan Bootstrap adalah dengan menggunakan grid sistem responsif. Dengan menggunakan kelas-kelas grid responsif seperti Misalnya, Anda dapat menggunakan kelas Dengan menggunakan grid sistem responsif Bootstrap, Anda dapat dengan mudah mengatur tata letak halaman agar tetap terlihat baik pada berbagai ukuran layar. Bootstrap juga menyediakan kelas-kelas yang memungkinkan Anda untuk menyembunyikan atau menampilkan konten tertentu berdasarkan ukuran layar. Anda dapat menggunakan kelas seperti Misalnya, jika Anda ingin menyembunyikan sebuah elemen pada ukuran layar kecil (sm), Anda dapat menggunakan kelas Bootstrap juga menggunakan media query untuk mengatur tampilan responsif. Media query adalah fitur CSS yang memungkinkan Anda untuk mengatur tampilan elemen berdasarkan ukuran layar atau perangkat yang digunakan oleh pengguna. Bootstrap menyediakan beberapa media query yang dapat Anda gunakan, seperti Dengan menggunakan media query, Anda dapat mengatur gaya CSS tertentu untuk berlaku hanya pada ukuran layar tertentu. Misalnya, Anda dapat mengatur ukuran font atau tata letak elemen berbeda pada ukuran layar yang berbeda. Saat menggunakan Bootstrap, Anda juga memiliki opsi untuk menyesuaikannya sesuai kebutuhan Anda. Pada sesi ini, kami akan membahas cara mengkustomisasi Bootstrap, mulai dari mengubah warna hingga menambahkan gaya khusus. Salah satu cara terbaik untuk mengkustomisasi Bootstrap adalah dengan menggunakan variabel Sass. Sass adalah preprocessor CSS yang memungkinkan Anda untuk menggunakan fitur-fitur seperti variabel, mixin, dan fungsi dalam kode CSS Anda. Bootstrap menggunakan Sass sebagai bagian dari proses pengembangannya, dan menyediakan file Sass yang dapat Anda ubah sesuai kebutuhan Anda. Dalam file Sass Bootstrap, Anda dapat menemukan berbagai variabel yang mengontrol aspek-aspek seperti warna, padding, margin, dan banyak lagi. Dengan mengubah nilai variabel-variabel ini, Anda dapat dengan mudah mengkustomisasi tampilan Bootstrap sesuai dengan preferensi desain Anda sendiri. Selain mengubah variabel Sass, Andajuga dapat menggunakan tema Bootstrap yang telah dikustomisasi sebelumnya. Tema Bootstrap adalah kumpulan gaya dan desain yang telah dibuat oleh komunitas pengembang atau pihak ketiga. Anda dapat menemukan berbagai tema Bootstrap yang tersedia secara gratis atau berbayar di situs-situs seperti Bootstrap Themes atau ThemeForest. Dengan menggunakan tema Bootstrap, Anda dapat dengan cepat menerapkan desain yang sudah jadi dan mengubah tampilan website Anda dengan mudah. Anda dapat memilih tema yang sesuai dengan gaya dan tujuan website Anda, dan menginstalnya dengan mengikuti petunjuk yang disediakan oleh pembuat tema. Selain itu, Anda juga dapat menambahkan gaya khusus sendiri ke dalam kode CSS Anda untuk mengkustomisasi tampilan Bootstrap. Anda dapat menambahkan kelas khusus atau menulis aturan CSS tambahan untuk mengubah warna, ukuran, tata letak, dan gaya elemen-elemen tertentu dalam Bootstrap. Dengan mengkustomisasi Bootstrap, Anda dapat menciptakan tampilan yang unik dan sesuai dengan kebutuhan dan preferensi desain Anda. Namun, perlu diingat bahwa saat mengkustomisasi Bootstrap, Anda juga perlu mempertimbangkan pemeliharaan dan pembaruan di masa depan. Jika Anda membuat perubahan yang signifikan pada kode Bootstrap, Anda mungkin perlu memperbarui perubahan tersebut saat Bootstrap merilis pembaruan versi baru. Navigasi adalah salah satu elemen penting dalam pengembangan website. Di sesi ini, kami akan membahas cara membuat navigasi yang menarik dengan menggunakan komponen navigasi yang disediakan oleh Bootstrap. Navbar adalah komponen navigasi yang sering digunakan dalam Bootstrap. Navbar dapat digunakan untuk membuat menu navigasi yang responsif dan menarik. Dalam Bootstrap, Anda dapat dengan mudah membuat navbar dengan menggunakan kelas Anda dapat menambahkan elemen-elemen seperti logo, tautan navigasi, dan elemen lainnya ke dalam navbar. Anda juga dapat menggunakan kelas-kelas seperti Navbar juga mendukung variasi seperti navbar dengan background transparan atau dengan warna latar belakang yang kustom. Anda dapat mengatur tampilan navbar menggunakan kelas-kelas seperti Bootstrap juga menyediakan komponen dropdown menu yang dapat Anda gunakan dalam navigasi Anda. Dropdown menu memungkinkan Anda untuk menyembunyikan tautan-tautan yang tidak perlu dan menampilkan mereka hanya ketika pengguna mengklik atau mengarahkan kursor ke elemen dropdown. Anda dapat menambahkan elemen dropdown menu ke dalam navbar dengan menggunakan kelas Anda dapat menambahkan tautan-tautan dropdown menu ke dalam elemen Dengan menggunakan komponen dropdown menu Bootstrap, Anda dapat membuat navigasi yang lebih interaktif dan rapi, serta memberikan pengalaman yang lebih baik bagi pengguna Anda. Bootstrap juga dapat membantu meningkatkan kinerja website Anda. Di sesi ini, kami akan memberikan tips dan trik untuk mengoptimalkan penggunaan Bootstrap sehingga website Anda dapat berjalan lebih cepat dan efisien. Selalu pastikan Anda menggunakan versi terbaru dari Bootstrap. Setiap versi baru Bootstrap umumnya menghadirkan peningkatan performa dan perbaikan bug dari versi sebelumnya. Dengan menggunakan versi terbaru, Anda dapat memastikan bahwa Anda mendapatkan manfaat dari peningkatan performa dan keamanan yang disediakan oleh Bootstrap. Bootstrap menyediakan banyak komponen yang dapat Anda gunakan dalam pengembangan website. Namun, tidak semua komponen mungkin diperlukan dalam setiap proyek. Dalam penggunaan Bootstrap, pilihlah hanya komponen yang benar-benar Anda butuhkan untuk mengurangi beban dan ukuran file CSS dan JavaScript yang harus diunduh oleh pengguna. Dengan memilih komponen yang dibutuhkan, Anda dapat mengoptimalkan kinerja website Anda dengan mengurangi waktu unduh dan memperkecil ukuran file yang harus diproses oleh browser. Sebelum mempublikasikan website Anda, pastikan untuk mengompres dan menggabungkan file CSS dan JavaScript Bootstrap yang Anda gunakan. Dengan mengompres file CSS dan JavaScript, Anda dapat mengurangi ukuran file dan mengurangi waktu unduh oleh pengguna. Anda juga dapat menggabungkan beberapa file CSS atau JavaScript menjadi satu file untuk mengurangi jumlah permintaan HTTP yang harus dilakukan oleh browser pengguna. Dengan mengurangi jumlah permintaan HTTP, Anda dapat meningkatkan waktu muat halaman dan kinerja keseluruhan website Anda. Jika Anda ingin mempercepat waktu unduh dan mengoptimalkan kinerja website Anda, Anda dapat menggunakan CDN (Content Delivery Network) untuk menghosting file-file Bootstrap. CDN adalah jaringan server global yang menyimpan file-file Bootstrap dan mendistribusikannya secara efisien ke pengguna di seluruh dunia. Dengan menggunakan CDN Bootstrap, Anda dapat mengurangi latensi unduh dan mempercepat waktu muat halaman website Anda. Anda hanya perlu menambahkan tautan ke file CSS dan JavaScript Bootstrap yang dihosting di CDN, seperti: Dengan menggunakan CDN Bootstrap, Anda dapat meningkatkan kinerja website Anda tanpa perlu menghosting file-file Bootstrap sendiri. Akhirnya, di sesi terakhir ini, kami akan memberikan sumber daya dan komunitas yang dapat Anda manfaatkan untuk memperdalam pengetahuan Anda tentang Bootstrap. Kami akan merekomendasikan beberapa tutorial, dokumentasi, dan forum yang dapat membantu Anda dalam pengembangan website menggunakan Bootstrap. Dokumentasi resmi Bootstrap adalah sumber daya utama untuk mempelajari Bootstrap. Di dokumentasi ini, Anda dapat menemukan penjelasan rinci tentang setiap komponen, gaya, dan fitur Bootstrap, serta contoh penggunaan dan petunjuk penggunaan yang jelas. Anda dapat mengakses dokumentasi resmi Bootstrap di situs resminya di getbootstrap.com. Pastikan untuk membaca dokumentasi sesuai dengan versi Bootstrap yang Anda gunakan. Selain dokumentasi resmi, ada banyak tutorial dan artikel online yang dapat membantu Anda mempelajari dan menguasai Bootstrap. Banyak situs web dan blog teknologi menyediakan tutorial dan panduan langkah demi langkah tentang penggunaan Bootstrap. Anda dapat mencari tutorial Bootstrap di situs-situs seperti W3Schools, MDN Web Docs, atau Tutorialspoint. Pastikan untuk memilih tutorial yang terpercaya dan berkualitas untuk mendapatkan pemahaman yang baik tentang Bootstrap. Bootstrap memiliki komunitas pengembang yang aktif dan ramah, yang dapat menjadi sumber daya berharga untuk memperdalam pengetahuan Anda tentang Bootstrap. Komunitas pengembang Bootstrap dapat membantu Anda dengan menjawab pertanyaan, memberikan saran, dan berbagi pengalaman mereka dalam menggunakan Bootstrap. Anda dapat bergabung dengan komunitas pengembang Bootstrap melalui forum online seperti Stack Overflow atau grup Facebook yang fokus pada pengembangan web. Di sana, Anda dapat berinteraksi dengan pengembang lain, bertanya tentang masalah yang Anda hadapi, dan berbagi pengetahuan Anda tentang Bootstrap. Selain itu, Anda juga dapat mengikuti akun media sosial Bootstrap seperti Twitter atau Instagram untuk mendapatkan pembaruan terbaru tentang perkembangan Bootstrap, tips dan trik, serta sumber daya tambahan. Dengan memanfaatkan sumber daya dan komunitas Bootstrap, Anda dapat terus memperluas pengetahuan dan keterampilan Anda dalam menggunakan Bootstrap. Anda juga dapat terhubung dengan pengembang lain yang memiliki minat dan tujuan yang sama, yang dapat menjadi sumber inspirasi dan kolaborasi dalam pengembangan website. Dalam kesimpulan, Bootstrap adalah kerangka kerja yang kuat dan populer untuk pengembangan website. Dengan memahami dasar-dasar Bootstrap, mengkustomisasi tampilan sesuai kebutuhan Anda, dan mengoptimalkan kinerja website, Anda dapat menciptakan tampilan yang menarik dan responsif. Dengan sumber daya dan komunitas yang tersedia, Anda dapat terus belajar dan mengembangkan keterampilan Anda dalam menggunakan Bootstrap. Jadi, jangan ragu untuk memulai pengembangan website Anda dengan Bootstrap sekarang!.row. Kemudian, Anda dapat membagi elemen-elemen tersebut menjadi kolom-kolom dengan memberikan kelas .col- diikuti dengan jumlah kolom yang ingin Anda gunakan..col-6 pada kedua elemen tersebut:<div class="row"><div class="col-6"></div><div class="col-6"></div></div>.col-sm-, .col-md-, .col-lg-, dan .col-xl- untuk mengatur tata letak responsif sesuai dengan ukuran layar. Misalnya, Anda dapat menggunakan kelas .col-sm-6 untuk membagi halaman menjadi dua kolom pada ukuran layar kecil (sm).Komponen Utama
Tombol
.btn pada elemen <a> atau <button>. Anda juga dapat menggunakan variasi kelas seperti .btn-primary, .btn-secondary, atau .btn-success untuk memberikan gaya yang berbeda pada tombol Anda.Formulir
Navigasi
.nav untuk membuat daftar navigasi, dan kelas .nav-link untuk membuat tautan navigasi. Anda juga dapat menggunakan variasi kelas seperti .nav-pills atau .nav-tabs untuk memberikan gaya yang berbeda pada navigasi Anda.Jumbotron
.jumbotron pada elemen <div>. Anda juga dapat menggunakan kelas-kelas lain seperti .jumbotron-fluid untuk membuat jumbotron yang mengisi seluruh lebar layar.Tooltip
data-toggle="tooltip" pada elemen target dan memberikan kelas .tooltip pada elemen yang berisi informasi tooltip.Responsif dengan Bootstrap
Grid Responsif
.col-sm-, .col-md-, dan sebagainya, Anda dapat mengatur tampilan elemen-elemen dalam halaman agar menyesuaikan diri dengan ukuran layar pengguna..col-sm-6 untuk membagi halaman menjadi dua kolom pada ukuran layar kecil (sm), dan menggunakan kelas .col-md-4 untuk membagi halaman menjadi tiga kolom pada ukuran layar menengah (md).Konten Tersembunyi
.d-none untuk menyembunyikan konten pada semua ukuran layar, dan menggunakan kelas-kelas seperti .d-sm-none atau .d-md-block untuk mengontrol tampilan konten pada ukuran layar tertentu..d-none d-sm-block. Elemen tersebut akan tetap tersembunyi pada ukuran layar kecil, tetapi akan ditampilkan pada ukuran layar yang lebih besar.Media Query
@media (min-width: 576px) untuk ukuran layar kecil (sm), @media (min-width: 768px) untuk ukuran layar menengah (md), dan sebagainya.Kustomisasi Bootstrap
Variabel Sass
Tema Bootstrap
Membuat Navigasi yang Menarik dengan Bootstrap
Navbar
.navbar pada elemen <nav>..navbar-brand untuk logo dan .navbar-nav untuk daftar tautan navigasi..navbar-light atau .navbar-dark, serta menggunakan kelas-kelas lain seperti .bg-primary untuk warna latar belakang yang khusus.Dropdown Menu
.dropdown. Anda juga perlu menambahkan elemen <button> atau <a> dengan kelas .dropdown-toggle untuk mengaktifkan dropdown menu.<div> dengan kelas .dropdown-menu. Anda dapat menambahkan kelas-kelas seperti .dropdown-item untuk menentukan tautan-tautan di dalam dropdown menu.Meningkatkan Kinerja dengan Bootstrap
Gunakan Versi Bootstrap yang Terbaru
Pilih Komponen yang Dibutuhkan
Kompres dan Menggabungkan File CSS dan JavaScript
Gunakan CDN Bootstrap
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css"><script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.min.js"></script>Sumber Daya dan Komunitas Bootstrap
Dokumentasi Resmi Bootstrap
Tutorial dan Artikel Online
Komunitas Pengembang Bootstrap
Related video of Bootstrap Adalah: Panduan Lengkap untuk Memulai Pengembangan Website