Testen Sie Ihre Fähigkeiten: Formularstruktur

Ziel dieses Fähigkeitstests ist es zu beurteilen, ob Sie unseren Artikel Anleitung zur Strukturierung eines Webformulars verstanden haben.

Hinweis: Sie können die Lösungen in den interaktiven Editoren auf dieser Seite oder in einem Online-Editor wie CodePen, JSFiddle oder Glitch ausprobieren.

Wenn Sie nicht weiterkommen, können Sie sich in einem unserer Kommunikationskanäle an uns wenden.

Formularstruktur 1

In dieser Aufgabe möchten wir, dass Sie die bereitgestellten Formularfunktionen strukturieren:

  1. Trennen Sie die ersten beiden und die zweiten beiden Formularfelder in zwei separate Container, jeweils mit einer beschreibenden Legende (verwenden Sie "Persönliche Details" für die ersten zwei und "Kommentarinformationen" für die zweiten zwei).
  2. Markieren Sie jedes Textlabel mit einem geeigneten Element, sodass es semantisch mit seinem jeweiligen Formularfeld verknüpft ist.
  3. Fügen Sie eine geeignete Gruppe von strukturellen Elementen um die Label/Feld-Paare hinzu, um sie zu trennen.

Laden Sie den Ausgangspunkt für diese Aufgabe herunter, um in Ihrem eigenen Editor oder in einem Online-Editor zu arbeiten.