0% ont trouvé ce document utile (0 vote)
4 vues2 pages

Guide des balises HTML pour formulaires

Le document présente les balises HTML essentielles pour la création de formulaires, telles que <form>, <input>, <label>, et <select>. Il décrit également les attributs associés aux balises, comme type, name, et required, ainsi que les différents types d'<input> disponibles. Un exemple de formulaire complet est fourni, illustrant l'utilisation de ces balises et attributs dans un contexte pratique.

Transféré par

Hiab
Copyright
© All Rights Reserved
Nous prenons très au sérieux les droits relatifs au contenu. Si vous pensez qu’il s’agit de votre contenu, signalez une atteinte au droit d’auteur ici.
Formats disponibles
Téléchargez aux formats DOCX, PDF, TXT ou lisez en ligne sur Scribd
0% ont trouvé ce document utile (0 vote)
4 vues2 pages

Guide des balises HTML pour formulaires

Le document présente les balises HTML essentielles pour la création de formulaires, telles que <form>, <input>, <label>, et <select>. Il décrit également les attributs associés aux balises, comme type, name, et required, ainsi que les différents types d'<input> disponibles. Un exemple de formulaire complet est fourni, illustrant l'utilisation de ces balises et attributs dans un contexte pratique.

Transféré par

Hiab
Copyright
© All Rights Reserved
Nous prenons très au sérieux les droits relatifs au contenu. Si vous pensez qu’il s’agit de votre contenu, signalez une atteinte au droit d’auteur ici.
Formats disponibles
Téléchargez aux formats DOCX, PDF, TXT ou lisez en ligne sur Scribd

📌 Balises principales

Balise Description
<form> Conteneur du formulaire
<input> Champ de saisie (texte, email, mot de passe, etc.)
<label> Texte descriptif pour un champ
<textarea> Zone de texte multi-lignes
<select> Liste déroulante
<option> Options dans un <select>
<button> Bouton personnalisable
<fieldset> Groupe de champs
<legend> Titre d’un <fieldset>

📌 Attributs des balises

Attribut Description
type Définit le type d’<input> (text, email, password, number, etc.)
name Nom du champ pour l’envoi des données
id Identifiant unique du champ
for Lie un <label> à un champ via son id
placeholder Texte indicatif à l'intérieur du champ
value Valeur par défaut du champ
required Rend le champ obligatoire
disabled Désactive un champ
readonly Champ en lecture seule
min / max Valeurs minimales et maximales pour number et date
maxlength Nombre max de caractères
checked Coche par défaut un radio ou checkbox

📌 Types d’<input>

Type Description
text Champ de texte classique
email Vérifie si l’entrée est une adresse e-mail
password Champ de mot de passe (caché)
number Accepte uniquement des nombres
date Sélecteur de date
radio Bouton de sélection unique
checkbox Case à cocher (plusieurs choix possibles)
submit Bouton d’envoi du formulaire
reset Bouton pour réinitialiser le formulaire
file Permet de télécharger un fichier
hidden Champ invisible mais envoyé avec le formulaire

📌 Exemple de formulaire avec tout cela


<form action="[Link]" method="post">
<fieldset>
<legend>Informations personnelles</legend>

<label for="nom">Nom :</label>


<input type="text" id="nom" name="nom" placeholder="Votre nom"
required>

<label for="email">E-mail :</label>


<input type="email" id="email" name="email" required>

<label for="age">Âge :</label>


<input type="number" id="age" name="age" min="18" max="99">

<label>Genre :</label>
<input type="radio" name="genre" value="homme"> Homme
<input type="radio" name="genre" value="femme"> Femme

<label for="pays">Pays :</label>


<select id="pays" name="pays">
<option value="maroc">Maroc</option>
<option value="france">France</option>
</select>

<label for="message">Message :</label>


<textarea id="message" name="message"></textarea>

<label><input type="checkbox" name="conditions" required> J'accepte


les conditions</label>

<input type="submit" value="Envoyer">


</fieldset>
</form>

Vous aimerez peut-être aussi