Balise HTML <form>

Définition et utilisation

<form> Balise utilisée pour créer un formulaire HTML pour recevoir les entrées de l'utilisateur.

<form> Les éléments peuvent contenir un ou plusieurs éléments de formulaire suivants :

Voir également :

Tutoriel HTML :Formulaire HTML et entrées

Manuel de référence HTML DOM :Objet Formulaire

Tutoriel CSS : Définir le style du formulaire

Exemple

Exemple 1

Formulaire HTML avec deux champs d'entrée et un bouton de soumission :

<form action="/action_page.php" method="get">
  <label for="fname">Prénom :</label>
  <input type="text" id="fname" name="fname"><br><br>
  <label for="lname">Nom de famille :</label>
  <input type="text" id="lname" name="lname"><br><br>
  <input type="submit" value="Soumettre">
</form>

Essayez-le vous-même

Exemple 2

Formulaire HTML avec cases à cocher :

<form action="/action_page.php" method="get">
  <input type="checkbox" name="vehicle1" value="Vélo">
  <label for="vehicle1">Je possède un vélo</label><br>
  <input type="checkbox" name="vehicle2" value="Voiture">
  <label for="vehicle2">Je possède une voiture</label><br>
  <input type="checkbox" name="vehicle3" value="Bateau" checked>
  <label for="vehicle3">Je possède un bateau</label><br><br>
  <input type="submit" value="Soumettre">
</form>

Essayez-le vous-même

Exemple 3

Formulaire HTML avec boutons radio :

<form action="/action_page.php" method="get">
  <input type="radio" id="html" name="fav_language" value="HTML">
  <label for="html">HTML</label><br>
  <input type="radio" id="css" name="fav_language" value="CSS" checked="checked">
  <label for="css">CSS</label><br>
  <input type="radio" id="javascript" name="fav_language" value="JavaScript">
  <label for="javascript">JavaScript</label><br><br>
  <input type="submit" value="Soumettre">
</form>

Essayez-le vous-même

Attribut

Attribut Valeur Description
accept-charset Jeu de caractères Définit le codage des caractères utilisé lors de la soumission du formulaire.
action URL Définit où envoyer les données du formulaire lors de la soumission du formulaire.
autocomplete
  • on
  • off
 Définit si le formulaire doit activer la fonction d'auto-complétion.
enctype
  • application/x-www-form-urlencoded
  • multipart/form-data
  • text/plain
 Définit comment les données du formulaire doivent être codées lors de la soumission des données du formulaire au serveur.
method
  • get
  • post
 Définit la méthode HTTP utilisée pour envoyer les données du formulaire.
name text Définit le nom du formulaire.
novalidate novalidate Définit que le formulaire ne doit pas être vérifié lors de la soumission du formulaire.
rel
  • external
  • help
  • license
  • next
  • nofollow
  • noopener
  • noreferrer
  • opener
  • prev
  • search
 Définit la relation entre la ressource de lien et le document courant.
target
  • _blank
  • _self
  • _parent
  • _top
 Définit où afficher la réponse reçue après le soumission du formulaire.

Attributs globaux

<form> Le tag prend également en charge Attributs globaux dans HTML。

Attribut d'événement

<form> Le tag prend également en charge Attribut d'événement dans HTML。

Configuration CSS par défaut

La plupart des navigateurs utilisent les valeurs par défaut suivantes pour afficher <form> Élément :

form {
  display: block;
  margin-top: 0em;
}

Essayez-le vous-même

Compatibilité du navigateur

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
Support Support Support Support Support