Supprime les balises HTML et PHP d'une chaîne
Cet article explique les bases de la balise input en HTML, en mettant en avant quelques-uns de ses types les plus courants et en montrant un exemple de formulaire simple.
La balise <input> spécifie un champ de saisie où l'utilisateur peut entrer des données.
Les éléments <input> sont utilisés dans un élément <form> pour déclarer des contrôles d'entrée qui permettent aux utilisateurs d'entrer des données.
La balise <input> est utilisée pour créer des champs interactifs dans un formulaire HTML. Elle peut prendre plusieurs types, en fonction de l'interaction souhaitée.
Voici quelques-uns des types de champs les plus couramment utilisés avec la balise <input> :
Le champ d'entrée <input> a plusieurs variétés en fonction de l'attribut type voir le tableau en bas.
Exemple : 📋 Copier le code
<form action="page cible"> Nom: <input type="text" name="nom"><br> Prénom : <input type="text" name="pnom"><br> <input type="submit" value="Envoyer"> </form>
Cet exemple crée un formulaire avec un champ de saisie de texte pour le nom d'utilisateur, un champ de mot de passe, et un bouton de soumission.
La balise <input> est pris en charge dans tous les principaux navigateurs.
Remarque : L’élément <input> est toujours vide, il ne doit contenir que des attributs.
Astuce : Utilisez l'élément <label> pour définir des étiquettes pour les éléments <input>.
Dans HTML 4.01, l'attribut " align " est obsolète et n'est plus supporté en HTML5. Utiliser le CSS à la place.
En HTML5, la balise <input> a plusieurs nouveaux attributs, et l'attribut type a plusieurs nouvelles valeurs.
En HTML, la balise <input> n'a aucune balise de fin.
En XHTML, la balise <input> doit être correctement fermée, comme ça <input type="monType" value="" />.
La balise <input> en HTML prend plusieurs attributs qui permettent de contrôler son comportement et son apparence. Voici quelques-uns des attributs les plus couramment utilisés :
L'attribut type spécifie le type de champ à afficher. Les valeurs courantes sont :
Nouveau : Nouveauté en HTML5.
Attribut | Valeur | Description |
---|---|---|
accept |
audio/* video/* image/* MIME_type | Spécifie les types de fichiers que le serveur doit accepter (uniquement pour le type = " file ") |
align |
left right top middle bottom | N'est pas prise en charge en HTML5. Déconseillée dans HTML 4.01. Spécifie l'alignement d'une image d'entrée (uniquement pour type = " image ") |
alt | text | Spécifie un texte de remplacement pour les images (uniquement pour type = " image ") |
autocomplete Nouveau |
on off | Spécifie si un élément <input> devrait avoir la saisie automatique activé |
autofocus Nouveau | autofocus | Spécifie qu'un élément <input> doit obtenir automatiquement le focus lorsque la page est chargée |
checked | checked | Spécifie qu'un élément <input> devrait être présélectionné (coché ) lorsque la page est chargée (pour le type = " checkbox " ou le type = " radio ") |
disabled | disabled | Spécifie qu'un élément <input> doit être désactivé |
form Nouveau | form_id | Spécifie un ou plusieurs formulaires auxquelles l'élément <input> appartient |
formaction Nouveau | URL | Spécifie l'URL du fichier qui traitera le contrôle d'entrée lorsque le formulaire est envoyé (pour type = " submit " et type = " image ") |
formenctype Nouveau |
application/x-www-form-urlencoded multipart/form-data text/plain | Spécifie comment les données du formulaire doivent être encodées lors de la soumission d'une demande au serveur (pour type = " submit " et type = " image ") |
formmethod Nouveau |
get post | Définit la méthode HTTP pour l'envoi de données vers l'URL d'action (pour type = " submit " et type = " image ") |
formnovalidate Nouveau | formnovalidate | Spécifie que les éléments cette form ne doivent pas être validées lors de la soumission |
formtarget Nouveau |
_blank _self _parent _top framename | Spécifie l'emplacement où afficher la réponse reçue après avoir rempli le formulaire (pour type = " submit " et type = " image ") |
height Nouveau | pixels | Spécifie la hauteur d'un élément <input> (uniquement pour type = " image ") |
list Nouveau | datalist_id | Fait référence à un élément <datalist> qui contient les options prédéfinies pour un élément <input> |
max Nouveau |
number date | Spécifie la valeur maximale d'un élément <input> |
maxlength | number | Spécifie le nombre maximal de caractères autorisés dans un élément <input> |
min Nouveau |
number date | Spécifie une valeur minimale d'un élément <input> |
multiple Nouveau | multiple | Spécifie qu'un utilisateur peut entrer plusieurs valeurs dans un élément <input> |
name | text | Spécifie le nom d'un élément <input> |
pattern Nouveau | regexp | Spécifie une expression régulière à laquelle la valeur de l'élément <input> doit être comparée |
placeholder Nouveau | text | Spécifie une courte indication qui décrit la valeur attendue de l'élément <input> |
readonly | readonly | Spécifie qu'un champ d'entrée est en lecture seule |
required Nouveau | required | Spécifie qu'un champ de saisie doit être rempli avant d'envoyer le formulaire |
size | number | Spécifie la largeur, en caractères, d'un élément <input> |
src | URL | Spécifie l'URL de l'image à utiliser comme un bouton d'envoi (uniquement pour type = " image ") |
step Nouveau | number | Spécifie les intervalles numériques légales pour un champ de saisie |
type |
button checkbox color date datetime datetime-local file hidden image month number password radio range reset search submit tel text time url week | Spécifie le type de l'élément <input> à afficher |
value | text |
Spécifie la valeur d'un élément <input> |
width Nouveau | pixels | Spécifie la largeur d'un élément <input> (uniquement pour type = " image ") |
La balise <input> prend également en charge les Attributs globaux dans HTML.
La balise <input> prend également en charge les Attributs de l'événement au format HTML.
Pages connexes
Tutoriel HTML: formulaires HTML
Tutoriel PHP: traitement des formulaires en php
Retour à l'accueil du site
Par carabde 10 mars 2014