Baseline Widely available
Das <option>- HTML-Element wird verwendet, um ein Element zu definieren, das in einem <select>, einem <optgroup> oder einem <datalist>-Element enthalten ist. Als solches kann <option> Menüeinträge in Popup-Fenstern und anderen Listen von Elementen in einem HTML-Dokument darstellen.
<label for="pet-select">Choose a pet:</label>
<select id="pet-select">
<option value="">--Please choose an option--</option>
<option value="dog">Dog</option>
<option value="cat">Cat</option>
<option value="hamster">Hamster</option>
<option value="parrot">Parrot</option>
<option value="spider">Spider</option>
<option value="goldfish">Goldfish</option>
</select>
label {
font-family: sans-serif;
font-size: 1rem;
padding-right: 10px;
}
select {
font-size: 0.9rem;
padding: 2px 5px;
}
Dieses Element umfasst die globalen Attribute.
disabled
Wenn dieses Boolean-Attribut gesetzt ist, kann diese Option nicht ausgewählt werden. Oftmals werden solche Steuerelemente von Browsern ausgegraut und sie erhalten keine Browsereignisse, wie Mausklicks oder fokussierungsbezogene Ereignisse. Wenn dieses Attribut nicht gesetzt ist, kann das Element dennoch deaktiviert sein, wenn einer seiner Vorfahren ein deaktiviertes <optgroup>-Element ist.
label
Dieses Attribut ist der Text für das Label, das die Bedeutung der Option angibt. Wenn das label-Attribut nicht definiert ist, entspricht sein Wert dem Textinhalt des Elements.
selected
Wenn vorhanden, gibt dieses Boolean-Attribut an, dass die Option initial ausgewählt ist. Wenn das <option>-Element ein Nachfolger eines <select>-Elements ist, dessen multiple-Attribut nicht gesetzt ist, darf nur ein einziges <option> dieses <select>-Elements das selected-Attribut besitzen.
value
Der Inhalt dieses Attributs stellt den Wert dar, der mit dem Formular übermittelt werden soll, sollte diese Option ausgewählt sein. Wenn dieses Attribut ausgelassen wird, wird der Wert aus dem Textinhalt des Option-Elements entnommen.
Die Gestaltung von <option>-Elementen war historisch gesehen stark eingeschränkt. Anpassbare Select-Elemente erklärt neuere Funktionen, die ihre vollständige Anpassung ermöglichen, genau wie bei jedem regulären DOM-Element.
In Browsern, die die modernen Anpassungsfunktionen nicht unterstützen (oder in alten Codebasen, in denen sie nicht verwendet werden können), hängt die verfügbare Gestaltung von <option>-Elementen vom Browser und Betriebssystem ab. Je nach Betriebssystem wird die font-size des besitzenden <select> in Firefox und Chromium respektiert. Chromium kann zusätzlich color, background-color, font-family, font-variant und text-align zulassen.
Weitere Details zur alten <option>-Gestaltung finden Sie in unserem Leitfaden zur erweiterten Formular-Gestaltung.
Siehe <select> für Beispiele.
<select>-Elementen sind nur Textinhalte erlaubt, möglicherweise mit escapten Zeichen (wie é). In anpassbaren Select-Elementen können <option>-Elemente beliebige Inhalte haben. Tag-Auslassung Der Start-Tag ist obligatorisch. Der End-Tag ist optional, wenn dieses Element unmittelbar gefolgt wird von einem anderen <option>-Element oder einem <optgroup>, oder wenn das Elternelement keinen weiteren Inhalt hat. Erlaubte Eltern Ein <select>, ein <optgroup> oder ein <datalist>-Element. Implizite ARIA-Rolle option Zulässige ARIA-Rollen Keine role erlaubt DOM-Schnittstelle [`HTMLOptionElement`](/de/docs/Web/API/HTMLOptionElement) Spezifikationen Browser-Kompatibilität Siehe auch
<form>, <legend>, <label>, <button>, <select>, <datalist>, <optgroup>, <fieldset>, <textarea>, <input>, <output>, <progress> und <meter>.RetroSearch is an open source project built by @garambo | Open a GitHub Issue
Search and Browse the WWW like it's 1997 | Search results from DuckDuckGo
HTML:
3.2
| Encoding:
UTF-8
| Version:
0.7.4