Input-Typen

Mit dem type-Attribut legst du fest, welche Art von Eingabefeld du brauchst – zum Beispiel Text, E-Mail oder Passwort.

• type bestimmt die Art des Eingabefelds (z. B. Text, E-Mail, Passwort).
• id identifiziert das Feld eindeutig und verbindet es mit einem <label>.
• name ist der Schlüssel, unter dem der Wert beim Absenden gesendet wird.

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

Wichtige Input Typen

Text & grundlegende Eingaben

• type="text" - Standard-Eingabefeld für kurze Texte (z. B. Name)
• type="password" - Eingabe wird verdeckt angezeigt (für Passwörter)
• type="email" - Für E-Mail-Adressen mit automatischer Validierung
• type="search" - Spezielles Textfeld für Suchanfragen

Zahlen und Werte

• type="number" - Nur Zahlen erlaubt, oft mit Pfeilen zur Anpassung
• type="range" - Schieberegler zur Auswahl eines Wertes

Datum und Zeit

• type="date" - Datumsauswahl über Kalender
• type="time" - Eingabe einer Uhrzeit
• type="datetime-local" - Kombination aus Datum und Uhrzeit
• type="month" - Auswahl eines Monats
• type="week" - Auswahl einer Kalenderwoche

Dateien und Medien

• type="file" - Hochladen von Dateien

Input Type text

1<label for="vorname">Vorname:</label><br>
2<input type="text" id="vorname" name="vorname"><br>
3<label for="vorname">Nachname:</label><br>
4<input type="text" id="nachname" name="nachname">
5

Input Type email und password

1<label for="vorname">E-mail:</label><br>
2<input type="email" id="email" name="email"><br>
3<label for="vorname">Passwort:</label><br>
4<input type="password" id="passwort" name="passwort">

Input Type number und range

1<input type="number" id="nummer" name="nummer"><br>
2<input type="range" id="range" name="range">

Input Type date und time

1<input type="time" id="time" name="time"><br>
2 <input type="date" id="date" name="date">