Éléments de formulaire HTML

Ce chapitre décrit tous les éléments de formulaire HTML.

l'élément <input>

L'élément le plus important des formulaires est <input> éléments.

L'élément <input> peut varier selon les type Les attributs peuvent varier en forme.

Remarque :Le prochain chapitre explique tous les types d'entrée HTML.

L'élément <select> (liste déroulante)

<select> L'élément <select> définit (Liste déroulante:

Exemple

<select name="cars">
<option value="volvo">Volvo</option>
<option value="saab">Saab</option>
<option value="fiat">Fiat</option>
<option value="audi">Audi</option>
</select>

Essayer vous-même

<option> L'élément <option> définit les options à choisir.

Les listes généralement affichent la première option comme sélectionnée.

Vous pouvez définir une option prédéfinie en ajoutant l'attribut selected.

Exemple

<option value="fiat" selected>Fiat</option>

Essayer vous-même

L'élément <textarea>

<textarea> L'élément <textarea> définit un champ d'entrée multiligne (Zone de texte）：

Exemple

<textarea name="message" rows="10" cols="30">
Le chat jouait dans le jardin.
</textarea>

Essayer vous-même

Le code HTML suivant s'affiche dans le navigateur :

Le chat jouait dans le jardin.

Élément <button>

<button> L'élément définit un bouton cliquableBouton:

Exemple

<button type="button" onclick="alert('Hello World!')">Cliquez-moi !</button>

Essayer vous-même

Le code HTML suivant s'affiche dans le navigateur :

Éléments de formulaire HTML5

HTML5 ajoute les éléments de formulaire suivants :

  • <datalist>
  • <keygen>
  • <output>

Remarque :Par défaut, les navigateurs ne montrent pas les éléments inconnus. Les nouveaux éléments ne détériorent pas votre page.

Élément <datalist> HTML5

<datalist> L'élément <datalist> définit une liste d'options prédéfinies pour l'élément <input>.

L'utilisateur verra une liste déroulante des options prédéfinies lors de la saisie de données.

de l'élément <input> : list L'attribut doit faire référence à l'élément <datalist> : id Attributs.

Exemple

Définir des valeurs prédéfinies pour l'élément <input> via <datalist> :

<form action="action_page.php">
<input list="browsers">
<datalist id="browsers">
   <option value="Internet Explorer">
   <option value="Firefox">
   <option value="Chrome">
   <option value="Opera">
   <option value="Safari">
</datalist> 
</form>

Essayer vous-même