HTML-Input-Typen
One tag — input — many behaviors. The type attribute chooses the control style and hints the expected value.
Direkte Antwort
Set type to text, email, password, number, checkbox, radio, date, file, hidden, or submit. Pair visible inputs with label. Phones may show special keyboards for email and number.
📊 Einstiegs-Input-Typen
| type | Use |
|---|---|
| text | General single-line text |
| Email addresses | |
| password | Masked secrets |
| number | Numeric values |
| checkbox | On/off options (many can be checked) |
| radio | Pick one from a named group |
| date | Calendar date |
| file | Upload a file |
| submit | Submit button-style input (or prefer button) |
Several input types
html<form action="/join" method="post">
<label for="mail">Email</label>
<input id="mail" name="mail" type="email">
<label for="pw">Password</label>
<input id="pw" name="pw" type="password">
<label><input type="checkbox" name="news" value="yes"> Newsletter</label>
<label><input type="radio" name="plan" value="free"> Free</label>
<label><input type="radio" name="plan" value="pro"> Pro</label>
<button type="submit">Join</button>
</form>
Ausprobieren
- email + password form
- checkbox + radio group same name
- submit locally
- try number for age
Typische Fehler
- radios different names
- text for passwords
- missing checkbox labels
Zusammenfassung
- type selects behavior
- match type to data
- radios share name
- label visible inputs
🧠 Testen Sie Ihr Wissen
Testen Sie Ihr Wissen
Fordern Sie sich mit diesem interaktiven Quiz heraus und sehen Sie, wie gut Sie das Thema verstehen
📝 Anweisungen
- Lesen Sie jede Frage sorgfältig
- Wählen Sie die beste Antwort für jede Frage
- Sie können das Quiz so oft wiederholen, wie Sie möchten
- Ihr Fortschritt wird oben angezeigt