<option>: Das HTML-Option-Element

Baseline Widely available

This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015.

Das <option> HTML-Element wird verwendet, um ein Element in einem <select>, einem <optgroup> oder einem <datalist>-Element zu definieren. Daher kann <option> Menüeinträge in Popups und anderen Listen von Elementen in einem HTML-Dokument darstellen.

Probieren Sie es aus

Attribute

Dieses Element enthält die globalen Attribute.

disabled

Wenn dieses boolesche Attribut gesetzt ist, kann diese Option nicht ausgewählt werden. Oft werden solche Steuerelemente im Browser ausgegraut, und sie erhalten keine Ereignisse wie Mausklicks oder solche, die mit dem Fokus zusammenhängen. Ist dieses Attribut nicht gesetzt, kann das Element dennoch deaktiviert sein, wenn einer seiner Vorfahren ein deaktiviertes <optgroup>-Element ist.

label

Dieses Attribut ist ein Text, der die Bedeutung der Option beschreibt. Wenn das label-Attribut nicht definiert ist, wird sein Wert aus dem Textinhalt des Elements übernommen.

selected

Wenn vorhanden, zeigt dieses boolesche Attribut an, dass die Option initial ausgewählt ist. Wenn das <option>-Element ein Nachkomme eines <select>-Elements ist, dessen multiple-Attribut nicht gesetzt ist, darf nur ein einziges <option>-Element dieses <select>-Elements das selected-Attribut besitzen.

value

Der Inhalt dieses Attributs gibt den Wert an, der zusammen mit dem Formular abgesendet wird, wenn diese Option ausgewählt ist. Wenn dieses Attribut nicht angegeben ist, wird der Wert aus dem Textinhalt des Option-Elements übernommen.

Gestaltung mit CSS

Das Styling des <option>-Elements innerhalb eines <select>-Dropdowns ist stark eingeschränkt und abhängig vom Browser und Betriebssystem. Je nach Betriebssystem wird die font-size des äußeren <select> in Firefox und Chromium respektiert. Chromium erlaubt möglicherweise zusätzlich die Festlegung von color, background-color, font-family, font-variant und text-align.

Weitere Details zum Styling von <option> finden Sie in unserem Leitfaden zur erweiterten Formulargestaltung.

Beispiele

Siehe <select> für Beispiele.

Technische Übersicht

Inhaltskategorien Keine.
Erlaubter Inhalt Text, möglicherweise mit entzeichneten Zeichen (wie &eacute;).
Tag-Weglassen Der Start-Tag ist obligatorisch. Der End-Tag ist optional, wenn dieses Element unmittelbar von einem anderen <option>-Element oder einem <optgroup> gefolgt wird oder wenn das Elternelement keinen weiteren Inhalt hat.
Erlaubte Eltern Ein <select>, ein <optgroup> oder ein <datalist>-Element.
Implizite ARIA-Rolle option
Erlaubte ARIA-Rollen Keine erlaubte role
DOM-Schnittstelle [`HTMLOptionElement`](/de/docs/Web/API/HTMLOptionElement)

Spezifikationen

Specification
HTML
# the-option-element

Browser-Kompatibilität

Report problems with this compatibility data on GitHub
desktopmobile
Chrome
Edge
Firefox
Opera
Safari
Chrome Android
Firefox for Android
Opera Android
Safari on iOS
Samsung Internet
WebView Android
WebView on iOS
option
disabled
label
selected
value

Legend

Tip: you can click/tap on a cell for more information.

Full support
Full support
See implementation notes.

Siehe auch