HTML Element - form

Das form-Tag kennzeichnet einen zusammengehörenden Eingabebereich innerhalb einer Webseite.

Beispiel

<form>

<label for="vorname">Vorname</label><br>
<input type="text" id="vorname" name="vorname"><br>

<label for="nachname">Nachname</label><br>
<input type="text" id="nachname" name="nachname"><br>

<label for="mitteilung">Mitteilung</label><br>
<textarea id="mitteilung" name="mitteilung" rows="6" cols="60"></textarea><br>

<button type="button">absenden</button>

</form>

Definition und Verwendung

Das form-Tag definiert einen Bereich zum Erstellen eines HTML-Formulars für Benutzereingaben.

Ein mit dem form-Tag definiertes HTML-Formular kann unter anderem folgende HTML-Elemente enthalten:

Attribute

Attribute erweitern Elemente um zusätzliche Eigenschaften oder Informationen und beeinflussen deren Bedeutung, Verhalten oder Darstellung. Sie bestehen in der Regel aus einem Attributnamen und einem zugehörigen Wert, wobei die zulässigen Attribute vom jeweiligen Element abhängen und teils allgemein, teils elementbezogen definiert sind.

Eine besondere Gruppe bilden die aria-*-Attribute, die zur Unterstützung der Barrierefreiheit zusätzliche Informationen für assistive Technologien bereitstellen.

Attribute-Tabelle
Attribut Wert Beschreibung
URL Legt fest, wohin die Formulardaten beim Absenden eines Formulars gesendet werden sollen.
dialog
get
post
Gibt die HTTP-Methode an, die beim Senden von Formulardaten verwendet werden soll.
Text Gibt den Namen eines Formulars an
_blank
_self
_parent
_top
Legt nach dem Absenden des Formulars fest, wo die zu empfangene Antwort angezeigt werden soll.

Unterstützung von Global- und Event-Attributen

Das form-Tag unterstützt auch Global- und Event-Attribute.

Beispiel mit Attribut action

In diesem Beispiel wird das Attribut action angewendet, um eine Bestätigungsseite aufzurufen.
<form action="action/action-page.html">

<label for="vorname">Vorname</label><br>
<input type="text" id="vorname" name="vorname"><br>

<label for="nachname">Nachname</label><br>
<input type="text" id="nachname" name="nachname"><br>

<label for="mitteilung">Mitteilung</label><br>
<textarea id="mitteilung" name="mitteilung" rows="6" cols="60"></textarea><br>

<button type="submit">absenden</button>

</form>

Standardbrowser CSS

Webbrowser wenden auf viele Elemente vordefinierte CSS-Stile an, die eine grundlegende Struktur und Lesbarkeit sicherstellen. Umfang und Ausgestaltung dieser Standardstile können je nach Browser variieren, etwa in Bezug auf Abstände, Schriftgrößen oder die Darstellung einzelner Elemente.

form {
display: block;
margin-top: 0em;
}

Browserunterstützung

Die Unterstützung von Elementen und Attributen ist in den gängigen modernen Browsern weitgehend einheitlich gewährleistet. Unterschiede können dennoch in Details, im Einführungszeitpunkt neuer Funktionen oder bei experimentellen Features auftreten.

Diese Tabelle zeigt die Unterstützung des form durch gängige Webbrowser und ordnet dessen Verfügbarkeit im aktuellen Browserumfeld ein.
Element Firefox Internet Explorer / Edge Safari Chrome Opera
<form>