📬 Formulare & Eingabefelder

<form> – Formular-Container

Zweck: Umschließt alle Eingabeelemente, die gesendet werden sollen.

<form action="ziel.php" method="post">
  ... Eingabefelder ...
</form>

🔹 Wichtige Attribute:

• action – Zieladresse, an die das Formular gesendet wird (z. B. PHP-Skript)
• method – Übertragungsmethode: get oder post

Beispielausgabe:

<input> – Eingabefeld

Zweck: Erzeugt ein einzelnes Eingabefeld.

<input type="text" name="vorname">

🔹 Häufige Typen:

Beispielausgabe:

<label> – Beschriftung

Zweck: Verknüpft eine sichtbare Beschriftung mit einem Eingabefeld (wichtig für Barrierefreiheit).

<label for="mail">E-Mail:</label>
<input type="email" id="mail">

Beispielausgabe:

<select> & <option> – Dropdown-Auswahl

Zweck: Erstellt eine Auswahlbox mit mehreren Optionen.

<select name="farbe">
  <option>Rot</option>
  <option>Grün</option>
  <option>Blau</option>
</select>

Beispielausgabe:

<textarea> – Mehrzeiliges Eingabefeld

Zweck: Für längere Texteingaben (z. B. Kommentare, Nachrichten).

<textarea rows="4" cols="30">Standardtext</textarea>

Beispielausgabe:

<fieldset> & <legend> – Gruppierung

Zweck: Gruppiert mehrere Formularfelder logisch.

<fieldset>
  <legend>Persönliche Daten</legend>
  <label for="vorname">Vorname:</label>
  <input type="text" id="vorname">
  <label for="nachname">Nachname:</label>
  <input type="text" id="nachname">
</fieldset>

Beispielausgabe:

💡 Nützliche Attribute

• placeholder – zeigt Beispieltext im Eingabefeld
• required – markiert Pflichtfelder
• value – voreingestellter Wert
• readonly – Feld ist nicht editierbar
• disabled – Feld ist deaktiviert

<input type="text" placeholder="Vorname" required>

Beispielausgabe: