Membuat Select Menu dengan Bootstrap 5

Membuat Select Menu dengan Bootstrap 5

—

by

Webbiz.ID
in

Berikut adalah contoh kode untuk membuat Select Menu menggunakan Bootstrap 5

HTML
<!DOCTYPE html>
<html lang="en">
   <head>
      <title>Bootstrap Example</title>
      <meta charset="utf-8">
      <meta name="viewport" content="width=device-width, initial-scale=1">
      <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/css/bootstrap.min.css" rel="stylesheet">
      <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/js/bootstrap.bundle.min.js"></script>
   </head>
   <body>
      <div class="container mt-3">
         <h3>Select Menu</h3>
         <form>
            <div class="mb-3">
               <label for="selectMenu" class="form-label">Pilih Opsi:</label>
               <select class="form-select" id="selectMenu" aria-label="Pilih Opsi">
                  <option selected>Pilih...</option>
                  <option value="1">Opsi 1</option>
                  <option value="2">Opsi 2</option>
                  <option value="3">Opsi 3</option>
               </select>
            </div>
            <button type="submit" class="btn btn-primary">Submit</button>
         </form>
      </div>
   </body>
</html>
HTML
Bootstrap Example

Select Menu


Anda dapat menyalin kode di atas dan menyimpannya dalam file HTML. Kemudian, buka file tersebut menggunakan browser web untuk melihat tampilan Select Menu yang telah dibuat dengan menggunakan Bootstrap 5.

Pastikan Anda telah menyertakan link ke file CSS Bootstrap dan juga file JavaScript Bootstrap di dalam kode HTML Anda untuk memastikan Bootstrap berfungsi dengan baik.

Selamat mencoba!

Artikel Terbaru ⭐