Maison interface Web tutoriel HTML Quels sont les attributs de la balise d'entrée html ? Résumé de l'utilisation de la balise d'entrée (avec exemples)

Quels sont les attributs de la balise d'entrée html ? Résumé de l'utilisation de la balise d'entrée (avec exemples)

Sep 04, 2018 pm 05:27 PM
html input

Cet article vous présente principalement les attributs de la balise d'entrée html , ainsi qu'un résumé de l'utilisation spécifique de la balise d'entrée html. Jetons un coup d'œil aux utilisations de la balise d'entrée html

Tout d'abord, parlons des attributs de la balise d'entrée html :

1.type : Ceci l'attribut est input Le seul attribut de la balise qui doit être saisi. Bien sûr, il peut être laissé vide. La valeur par défaut est type = "text". Les valeurs spécifiques dont il dispose seront discutées plus tard.

2.required : indiquez si un champ est obligatoire. Si un champ est marqué comme obligatoire = "obligatoire" (en mode strict), ou obligatoire (en mode détendu) (ps : les attributs suivants sont écrits de la même manière, ils ne sont donc pas écrits un par un), et le La valeur de ce champ est vide ou la valeur renseignée est une valeur invalide, le formulaire ne peut pas être soumis. Qu'est-ce qu'une valeur invalide ? Regardez l'attribut pattern.

3.pattern : Cet attribut contient une expression régulière de style JavaScript. Le contenu d'entrée doit correspondre complètement à l'expression régulière, sinon le contenu d'entrée sera invalide. Vous ne connaissez pas les expressions régulières ? Vous pouvez jeter un œil aux expressions régulières JavaScript.

4.min max : Ces deux attributs sont utilisés pour la date, l'heure, l'heure et d'autres entrées, ainsi que le nombre et la plage. Comme son nom l’indique, leur rôle est de limiter les valeurs maximales et minimales.

5.step : Semblable à max min, sa fonction est de fournir un bouton sur lequel on peut cliquer de haut en bas. Par exemple, le nombre actuel est 1 et vous définissez step = "5". bouton haut et il deviendra 6. .

6. espace réservé : il n'y a pas grand chose à dire sur cet attribut. Tout le monde devrait le connaître. Il est généralement utilisé pour inviter l'utilisateur à saisir du texte, il sera écrasé par. le texte saisi.

7.readonly : Comme son nom l'indique, cette propriété rendra le contrôle vide du formulaire non modifiable. Le fait qu'il ne soit pas modifiable ici ne signifie pas qu'il est désactivé, mais que le texte ne peut pas être modifié. Par exemple, la radio et les cases à cocher sont intrinsèquement non modifiables, cet attribut n'a donc aucun sens pour eux.

8.disabled : Cet attribut désactive un élément de formulaire. Ceci est désactivé, désactivant complètement tous les éléments du formulaire à l'exception de .

9.maxlength : Cet attribut est utilisé pour limiter le nombre maximum de mots saisis par l'utilisateur.

10.size : Cela n'a plus d'effet pratique. Le contrôle de la taille est désormais presque entièrement contrôlé par CSS.

11.form : En HTML5, il n'est pas nécessaire d'imbriquer les contrôles de formulaire dans un formulaire. Le nouvel attribut de formulaire peut associer des éléments de formulaire à n'importe quel formulaire de la page. Il peut également être imbriqué dans un formulaire et soumis avec un autre formulaire. Le code est le suivant :

<form id="form1"></form>
<p>
<label for="admin">admin</label>
<input type="text" id="admin" form="form1"/>
</p>
Copier après la connexion

De cette façon, le formulaire et la saisie sont connectés. Si l'entrée n'a pas d'attribut de formulaire, elle sera alors associée au formulaire le plus proche.

12.autocomplete : comme son nom l'indique, la saisie semi-automatique, l'utilisateur saisit une partie de la saisie et le reste est automatiquement complété. Le navigateur doit enregistrer le contenu saisi par l'utilisateur afin qu'il puisse être complété automatiquement la prochaine fois.

13.autofocus : Cet attribut signifie que ce contrôle de formulaire prend automatiquement le focus lorsque la page est chargée.

Ce qui précède sont les attributs de la balise d'entrée html. (Si vous voulez en voir plus, rendez-vous sur le site PHP chinois. Voici le Tutoriel vidéo HTML le plus complet)

Parlons maintenant de l'utilisation des balises d'entrée :

Regardez d'abord un exemple de balise d'entrée HTML :

<form action="demo_form.asp">
用户名: <input type="text" name="fname"><br>
输入框: <input type="text" name="lname"><br>
<input type="submit" value="提交">
</form>
Copier après la connexion

L'effet de ceci est celui indiqué dans la figure :

Quels sont les attributs de la balise dentrée html ? Résumé de lutilisation de la balise dentrée (avec exemples)

L'effet est toujours bon, c'est aussi le style de zone de saisie le plus simple. Ce dont nous parlons aujourd'hui sera simple signifie également facile à comprendre.

Parlons du résumé d'utilisation de la balise d'entrée html :

Zone de texte :

Dans le formulaire, Les zones de texte sont utilisées pour permettre aux utilisateurs de saisir des lettres, des chiffres, etc., tels que le nom, l'adresse, etc. de l'utilisateur.

Le format du code est le suivant :

<input type=”text” name=”...” size=”...” maxlength=”...” value=”...”/>
Copier après la connexion

2. Zone de mot de passe :

est un champ de texte spécial utilisé pour saisir les mots de passe.

Le format du code est le suivant :

<input type=”password” name=”...”  size=”...” maxlength=”...” value=”...”/>
Copier après la connexion

3. Champs masqués :

est un élément invisible utilisé pour collecter ou envoyer des informations, pour les pages Web Les champs masqués sont invisibles pour les visiteurs. Lorsque le formulaire est soumis, le champ masqué enverra des informations au serveur avec le nom et la valeur que vous avez définis lors de sa configuration.

Le format du code est le suivant :

<input type=”hidden” name=”...” value=”...”/>
Copier après la connexion

4. Bouton radio :

À utiliser lorsque l'utilisateur doit en sélectionner un parmi un nombre limité d’options. Par exemple, nous choisissons notre poids lors de l'inscription.

Le format du code est le suivant :

<input type=”radio” name=”...” value=”...”/>
Copier après la connexion

5. Case à cocher :

Permet de sélectionner plusieurs options parmi les options à être sélectionné. Chaque case à cocher est un élément indépendant et doit avoir un nom unique.

Le format du code est le suivant :

<input type=”checkbox” name=”...” value=”...”/>
Copier après la connexion

6. Boîte de téléchargement de fichier :

Le format du code est le suivant :

<input type”file” name=”...”>
Copier après la connexion

Remarque : Lors de l'utilisation de cette fonctionnalité, l'attribut méthode doit être spécifié dans la balise form. Pour spécifier la méthode comme post, l'attribut enctype est spécifié comme multipart/form-data.

Description : indique si le contrôle multipart télécharge plusieurs fichiers

Ce qui précède est l'introduction aux attributs de la balise d'entrée html dans cet article, ainsi qu'un résumé de l'utilisation de la balise d'entrée html. Si vous avez des questions, vous pouvez laisser un message ci-dessous.

[Recommandation de la rédaction]

Comment faire un menu déroulant html ? Introduction à l'exemple de code du menu déroulant HTML

Quelle est la différence entre la balise b et la balise forte en HTML ? Résumé de la différence entre b et strong

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn

Outils d'IA chauds

Undresser.AI Undress

Undresser.AI Undress

Application basée sur l'IA pour créer des photos de nu réalistes

AI Clothes Remover

AI Clothes Remover

Outil d'IA en ligne pour supprimer les vêtements des photos.

Undress AI Tool

Undress AI Tool

Images de déshabillage gratuites

Clothoff.io

Clothoff.io

Dissolvant de vêtements AI

AI Hentai Generator

AI Hentai Generator

Générez AI Hentai gratuitement.

Article chaud

R.E.P.O. Crystals d'énergie expliqués et ce qu'ils font (cristal jaune)
3 Il y a quelques semaines By 尊渡假赌尊渡假赌尊渡假赌
R.E.P.O. Meilleurs paramètres graphiques
3 Il y a quelques semaines By 尊渡假赌尊渡假赌尊渡假赌
R.E.P.O. Comment réparer l'audio si vous n'entendez personne
3 Il y a quelques semaines By 尊渡假赌尊渡假赌尊渡假赌
WWE 2K25: Comment déverrouiller tout dans Myrise
3 Il y a quelques semaines By 尊渡假赌尊渡假赌尊渡假赌

Outils chauds

Bloc-notes++7.3.1

Bloc-notes++7.3.1

Éditeur de code facile à utiliser et gratuit

SublimeText3 version chinoise

SublimeText3 version chinoise

Version chinoise, très simple à utiliser

Envoyer Studio 13.0.1

Envoyer Studio 13.0.1

Puissant environnement de développement intégré PHP

Dreamweaver CS6

Dreamweaver CS6

Outils de développement Web visuel

SublimeText3 version Mac

SublimeText3 version Mac

Logiciel d'édition de code au niveau de Dieu (SublimeText3)

Bordure de tableau en HTML Bordure de tableau en HTML Sep 04, 2024 pm 04:49 PM

Guide de la bordure de tableau en HTML. Nous discutons ici de plusieurs façons de définir une bordure de tableau avec des exemples de bordure de tableau en HTML.

Marge gauche HTML Marge gauche HTML Sep 04, 2024 pm 04:48 PM

Guide de la marge HTML gauche. Nous discutons ici d'un bref aperçu de la marge gauche HTML et de ses exemples ainsi que de son implémentation de code.

Tableau imbriqué en HTML Tableau imbriqué en HTML Sep 04, 2024 pm 04:49 PM

Ceci est un guide des tableaux imbriqués en HTML. Nous discutons ici de la façon de créer un tableau dans le tableau ainsi que des exemples respectifs.

Disposition du tableau HTML Disposition du tableau HTML Sep 04, 2024 pm 04:54 PM

Guide de mise en page des tableaux HTML. Nous discutons ici des valeurs de la mise en page des tableaux HTML ainsi que des exemples et des résultats en détail.

Liste ordonnée HTML Liste ordonnée HTML Sep 04, 2024 pm 04:43 PM

Guide de la liste ordonnée HTML. Ici, nous discutons également de l'introduction de la liste et des types HTML ordonnés ainsi que de leur exemple respectivement.

Espace réservé d'entrée HTML Espace réservé d'entrée HTML Sep 04, 2024 pm 04:54 PM

Guide de l'espace réservé de saisie HTML. Nous discutons ici des exemples d'espace réservé d'entrée HTML ainsi que des codes et des sorties.

Déplacer du texte en HTML Déplacer du texte en HTML Sep 04, 2024 pm 04:45 PM

Guide pour déplacer du texte en HTML. Nous discutons ici d'une introduction, du fonctionnement des balises de sélection avec la syntaxe et des exemples à implémenter.

Bouton HTML onclick Bouton HTML onclick Sep 04, 2024 pm 04:49 PM

Guide du bouton HTML onclick. Nous discutons ici de leur introduction, de leur fonctionnement, des exemples et de l'événement onclick dans divers événements respectivement.

See all articles