In dit onderdeel voegen we het name-attribuut niet toe aan de <input>-elementen. In echte formulieren is name wel belangrijk (o.a. om waarden te versturen), maar om de focus op de verschillende input-types te houden, laten we het hier bewust weg.

Daarnaast geldt: veel attributen die je bij tekst leert, zijn ook bruikbaar bij andere input-types (zoals email, password, …). We herhalen ze daarom niet telkens opnieuw.

Tekst

<input type="text" maxlength="20" size="15"/>

• size (optioneel): zichtbare breedte (in tekens)
• maxlength (optioneel): maximale lengte van de invoer

Wachtwoord

Een speciaal tekstveld waarin de ingevoerde tekst verborgen wordt door zwarte bollen.

<input type="password" size="15" maxlength="20">

Nummer

Een invoerveld voor numerieke waarden.

• min (optioneel): minimale waarde
• max (optioneel): maximale waarde
• step (optioneel): stapgrootte tussen min en max

<input type="number" min="1" max="100" step="5">

Tijd

Een invoerveld voor een tijdstip met pijltjes om de tijd aan te passen.

<input type="time">

Datum

Een invoerveld voor het selecteren van een datum.

<input type="date">

Kleur

Een invoerveld om een kleur te kiezen via een pop-up venster.

<input type="color">

E-mail

Een tekstveld voor een e-mailadres. De browser controleert of het formaat geldig is.

<input type="email">

URL

Een tekstveld voor een webadres. De browser controleert of het formaat geldig is.

<input type="url">

Telefoonnummer

Een tekstveld voor een telefoonnummer. De browser voert geen controle uit.

<input type="tel">

Samenvatting

Dit waren de meest voorkomende types, kijk op W3 Schools voor een volledig overzicht