Textarea

Textareas werden verwendet, um mehrzeilige Texteingaben innerhalb von Formularen zu erfassen.
Sie unterstützen Zustände wie Placeholder, Disabled, Readonly und Error.

Beispiele

Basic


<textarea class="a-textarea">
Dies ist ein mehrzeiliger Text.
</textarea>

Placeholder


<textarea
    class="a-textarea"
    placeholder="Beschreibung eingeben">
</textarea>

Disabled


<textarea
    class="a-textarea"
    disabled>
Nicht verfügbar
</textarea>

Readonly

Nur lesbar


<textarea
    class="a-textarea"
    readonly>
Nur lesbar
</textarea>

Error


<textarea class="a-textarea -error">
Ungültige Eingabe
</textarea>

Klassen

Klasse / Attribut	Beschreibung
`.a-textarea`	Basis-Klasse für mehrzeilige Eingabefelder.
`.-error`	Modifikator für fehlerhafte Eingaben.
`disabled`	Deaktiviert das Eingabefeld.
`readonly`	Markiert das Eingabefeld als nur lesbar.
`placeholder`	Zeigt einen Hinweis an, solange kein Inhalt vorhanden ist.

Hinweise

Textareas eignen sich für längere Texteingaben wie Beschreibungen, Kommentare oder Nachrichten.

Best Practices

Verwende Textareas für mehrzeilige Texteingaben. Für kurze Eingaben sollte stattdessen die Input-Komponente verwendet werden.

Verwende Placeholder nicht als Ersatz für Labels. Placeholder verschwinden beim Eingeben von Text.

Accessibility

Jede Textarea sollte mit einem sichtbaren <label> oder einem geeigneten aria-label verbunden sein.

Fehler sollten nicht ausschließlich über Farbe kommuniziert werden. Ergänze eine sichtbare Fehlermeldung.