HTML Input Types Testseite | form, button, date, password, file etc.

Rufe diese Seite mit einem Testgerät bzw. Browser deiner Wahl auf, um die verschiedenen Input Types von HTML zu testen.

Die hier dargestellten Input-Elemente werden in dem jeweiligen Browser-Stil dargestellt und haben neben den Browser-Default-Styles lediglich die CSS-Eigenschaften aus der normalize.css.

Noch Fragen offen?

Input-Types zur Texteingabe

Textfeld — type=“text“

• Browser-Support: Wird von allen Browsern unterstützt.
• Spezifikation

Passwortfeld — type=“password“

• Browser-Support: Wird von allen Browsern unterstützt.
• Spezifikation

Suchfeld — type=“search“

• Browser-Support: sehr gut
• Spezifikation

Web-Adresse (URL) — type=“url“

• Browser-Support: sehr gut
• Spezifikation

E-Mail-Adresse — type=“email“

• Browser-Support: sehr gut
• Spezifikation

Zahlen/Nummern — type=“number“

• Browser-Support: mittelmäßig
• Spezifikation

Telefonnummern — type=“tel“

• Browser-Support: sehr gut
• Spezifikation

Input-Types zur Auswahl und Eingabe

Datum — type=“date“

• Browser-Support: schlecht
• Spezifikation

Monat — type=“month“

• Browser-Support: schlecht
• Spezifikation

Woche — type=“week“

• Browser-Support: schlecht
• Spezifikation

Uhrzeit — type=“time“

• Browser-Support: schlecht
• Spezifikation

Datum und Uhrzeit — type=“datetime-local“

• Browser-Support: schlecht
• Spezifikation

Input-Types zum Auswählen bzw. Einstellen

Einfach-Slider — type=“range“

• Browser-Support: gut
• Spezifikation

Auswahlfeld (Checkbox) — type=“checkbox“

• Browser-Support: Wird von allen Browsern unterstützt.
• Spezifikation

Optionenfeld (Radiobutton) — type=“radio“

• Browser-Support: Wird von allen Browsern unterstützt.
• Spezifikation

Dateiupload — type=“file“

• Browser-Support: Wird von allen Browsern unterstützt.
• Spezifikation

Farbe — type=“color“

• Browser-Support: mittelmäßig
• Spezifikation

Button-Input-Types

Standard-Button — type=“button“

(hier ohne Angabe einer Beschriftung value)

• Browser-Support: Wird von allen Browsern unterstützt.
• Spezifikation

Senden-Button — type=“submit“

• Browser-Support: Wird von allen Browsern unterstützt.
• Spezifikation

Zurücksetzen-Button — type=“reset“

• Browser-Support: Wird von allen Browsern unterstützt.
• Spezifikation

Bild-Button — type=“image“

(hier ohne Angabe eines Bildes)

• Browser-Support: Wird von allen Browsern unterstützt.
• Spezifikation