Formularfelder beschriften

Zuletzt aktualisiert: Sonntag, 08. Januar 2017 Geschrieben von Jan Pionzewski

Seit der HTML-Spezifikation 4.01 gibt es spezielle HTML-Tags, mit denen sich Formularfelder beschriften lassen können. Dadurch hast du den Vorteil, dass du mit CSS diese Beschriftungen leicht formatieren kannst. Auch können Formularfelder, Checkboxen und Radiobuttons durch einen Klick auf die Beschriftungen aktiviert werden, ohne dass man ein zusätzliches JavaScript o.Ä. dafür verwenden muss.

In diesem Artikel zeige ich dir, wie das funktioniert.

 

 

Beschriftung für ein Formularfeld einrichten

Nachstehendes Code-Beispiel verdeutlicht die Einbindung einer Formularfeld-Beschriftung.

Code-Beispiel:

<form>
  <label for="1">Ihr Name</label> <input id="1" name="Name" type="text"><br />
  <label for="2">Ihre E-Mail-Adresse</label> <input id="2" name="email" type="text"><br />
  <label for="3">Newsletter abonnieren</label>  <input id="3" name="Newsletter" type="checkbox">
</form>

 

Mit dem Tag <label> lassen sich die Formularfelder beschriften. Das Attribut for="..." bewirkt, dass das Label dem Formularfeld innerhalb der Datei eindeutig zugeordnet werden kann.

 

 

Kommentar schreiben