Bootstrap Multiselect


In dem nach dem Text folgenden Beispiel haben wir ein Multiselect-Element erstellt, das es dem Nutzer ermöglicht, mehrere Optionen auszuwählen. Wir haben die Bootstrap-5-Klassen form-floating und mb-3 auf das div-Element angewendet, um es optisch ansprechend zu gestalten. Wir haben auch die Bootstrap-5-Klassen form-select und multiple auf das select-Element angewendet, um es in ein Multiselect-Element zu verwandeln.

Du kannst Dein eigenes Multiselect-Element erstellen, indem Du die Optionen durch die Optionen Deiner eigenen Webseite ersetzt und die Bootstrap-5-Klassen auf das Element anwendest, um es an Deine Bedürfnisse anzupassen.

Mit Bootstrap 5 kannst Du schnell und einfach ein Multiselect-Element erstellen und anpassen, um es an Deine Anforderungen anzupassen und den Nutzern Deiner Webseite eine verbesserte Benutzererfahrung zu bieten.

<!DOCTYPE html>
<html>
<head>
  <title>Bootstrap 5 Multiselect Example</title>
  <!-- Bootstrap-5 CSS -->
  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap/5.0.2/css/bootstrap.min.css">
</head>
<body>
  <div class="form-floating mb-3">
    <select class="form-select" id="multiSelect" multiple>
      <option value="1">Option 1</option>
      <option value="2">Option 2</option>
      <option value="3">Option 3</option>
      <option value="4">Option 4</option>
      <option value="5">Option 5</option>
    </select>
    <label for="multiSelect">Wähle mehrere Optionen aus</label>
  </div>

  <!-- Bootstrap-5 JS -->
  <script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap/5.0.2/js/bootstrap.min.js"></script>
</body>
</html>