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>