Tout ce que vous devez savoir sur les inputs en HTML

Comment utiliser l’élément input en HTML ?

Les éléments de saisie HTML sont utilisés pour créer des champs de saisie interactifs dans les formulaires HTML. Les champs de saisie peuvent être de différents types, tels que des champs de texte, des cases à cocher, des boutons radio, etc.

Pour ajouter un champ de saisie à un formulaire HTML, vous devez utiliser la baliseavec l’attribut type. Certains des types d’attributs de type les plus courants sont « texte », « email » et « mot de passe ».

Par exemple, pour créer un champ de texte simple, vous pouvez écrire :

Pour ajouter un bouton radio, vous pouvez écrire :

Vous devez ajouter des éléments d’entrée à la page HTML uniquement après avoir créé le formulaire à l’aide de balises

.

Quelques éléments à ne pas oublier dans votre formulaire !

Lors de la création de formulaires, il y a certaines choses que vous ne devez jamais oublier. Ces éléments peuvent sembler être de petits détails, mais ils peuvent faire toute la différence dans la façon dont les utilisateurs interagissent avec votre formulaire.

L’étiquette d’entrée est l’un des éléments les plus importants. L’étiquette d’entrée est ce qui est affiché à côté de l’entrée elle-même. Cela permet à l’utilisateur de savoir ce qu’il doit saisir dans le champ. Si vous ne spécifiez pas d’étiquette d’entrée, elle ne s’affichera que comme « entrée ».

Vous devez également spécifier le type d’entrée. Le type d’entrée détermine le type de données que l’utilisateur peut entrer dans le champ. Il existe différents types de saisie, mais les plus courants sont les champs de texte, les cases à cocher et les boutons radio.

Une autre chose à garder à l’esprit est la balise HTML « form ». La balise « form » permet au navigateur de savoir qu’un formulaire existe sur la page. Sans la balise « form », votre formulaire n’apparaîtra pas sur la page.

Enfin, vous devrez ajouter une entrée de type « email » à votre formulaire. Cela permettra aux utilisateurs de spécifier leur adresse e-mail lors de la soumission du formulaire. Cela peut être utile si vous souhaitez envoyer un e-mail à quelqu’un après avoir reçu son formulaire.

Le code HTML pour créer une zone de texte est le suivant : <textarea></textarea>

Lorsque vous souhaitez ajouter une zone de texte à une page HTML, vous devez utiliser la balise <textarea> étiquette. Cela créera une zone dans laquelle les visiteurs de votre site pourront saisir du texte.

Vous pouvez ajouter cette balise à votre code HTML n’importe où, mais si vous souhaitez que les utilisateurs puissent saisir des données dans votre formulaire, vous devez l’ajouter à <formulaire> à partir de votre code.

Il existe différents types de zones de texte que vous pouvez créer en fonction de ce que vous souhaitez que l’utilisateur saisisse. Par exemple, si vous souhaitez que l’utilisateur saisisse une adresse e-mail, vous pouvez ajouter l’attribut type= »email » à la <textarea> Tu.

Il existe de nombreuses autres options que vous pouvez ajouter à la zone de texte pour la personnaliser. Certains sont obligatoires, tandis que d’autres sont facultatifs. Consultez la documentation HTML pour en savoir plus sur les différents attributs que vous pouvez utiliser.

Les attributs de la balise input: id, name, type, value, placeholder, maxlength, readonly, required, autofocus, disabled.

IDENTIFICATION:

L’attribut ID de la balise d’entrée doit être unique pour tous les éléments du formulaire. Cela signifie qu’il ne peut pas y avoir deux éléments avec le même ID dans le même formulaire. Les identifiants sont utilisés pour identifier les éléments lorsque vous ajoutez des scripts ou des styles à votre page.

Nom:

L’attribut name de la balise input est utilisé pour nommer l’élément. Ceci est nécessaire lorsque vous travaillez avec des formulaires, car il s’agit du nom utilisé pour envoyer les données du formulaire au serveur.

Taper:

L’attribut type de la balise d’entrée définit le type de données que vous pouvez insérer dans l’élément. Il existe plusieurs types différents, mais les plus courants sont « texte », « e-mail » et « mot de passe ».

Score:

L’attribut value de la balise input définit la valeur par défaut de l’élément. Cela signifie que si vous avez une entrée de type « texte », la valeur par défaut est le texte que vous entrez dans l’élément.

Espace réservé :

L’attribut d’espace réservé de la balise d’entrée est utilisé pour ajouter un texte d’assistance à l’élément. Ce texte est affiché à l’intérieur de l’élément lorsqu’il est vide, ce qui est utile pour dire à l’utilisateur ce qu’il faut mettre dans l’élément.

Longueur maximale:

HTML5: les balises dépréciées à connaître

Devez-vous utiliser des balises HTML5 obsolètes ?

Même si les balises obsolètes ne sont pas validées par la spécification HTML5, elles ne doivent plus être utilisées. Les nouvelles balises et attributs de type d’entrée doivent être utilisés à la place.

Par exemple, vous ne devez plus utiliser la balise « forms » pour ajouter des formulaires à vos pages. Certains anciens formulaires ne fonctionneront pas avec HTML5. Il faut aussi éviter d’utiliser la balise « input » de type « email ».

Au lieu de cela, il vous suffit d’ajouter une entrée de formulaire en tapant « email » sur votre page. Cela vous permettra de profiter de tous les avantages de la spécification HTML5 tout en restant compatible avec les anciens navigateurs.

L’élément HTML est utilisé pour afficher une mesure scalaire dans une plage.

Balises HTMLutilisé pour afficher la taille scalaire dans une plage. Cela signifie que vous pouvez utiliser cet élément pour afficher des données numériques qui ont une valeur minimale et maximale prédéfinie. Pour ajouter cet élément à votre page HTML, il vous suffit de l’écrire comme ceci :

50%

Cet exemple montre une mesure de 50 % dans la plage de 0 à 100. La valeur de l’attribut de valeur doit être comprise entre les valeurs d’attribut min et max. Certains navigateurs Web peuvent afficher une barre de progression pour représenter visuellement la mesure.

Vous pouvez également utiliser des élémentssous forme HTML. Par exemple, vous pouvez ajouter une entrée de type « plage » à votre formulaire, comme ceci :

Votre note:

Dans cet exemple, nous avons ajouté une barre de progression à côté de l’entrée du formulaire, permettant à l’utilisateur de voir visuellement quel enregistrement il a sélectionné.

Les nouveaux attributs d’entrée dans HTML5 : les détails.

Le nouvel attribut d’entrée dans HTML5 vous permet d’ajouter certains types d’entrées à vos formulaires. Cet attribut doit être ajouté à la balisedans votre code HTML. Certains des nouveaux types d’entrée que vous pouvez utiliser sont « email », « tel », « url », « number », « range », « date », « month », « week », « time », « date time », « datetime-local », « search », « color ».

L’attribut « type » de l’élément « input » indique le type de données que vous souhaitez collecter avec votre formulaire. Vous écrivez simplement le type d’entrée que vous souhaitez utiliser. Par exemple, si vous souhaitez collecter des adresses e-mail, vous pouvez ajouter l’attribut type= »email » à votre balise d’entrée.

Si vous avez besoin de plus d’informations sur un type d’entrée spécifique, vous devez consulter la documentation HTML5. Vous y trouverez des instructions détaillées sur la façon d’utiliser le nouvel attribut d’entrée dans votre formulaire.