Introduction aux éléments de formulaire HTML

Dans les technologies de développement Web (en particulier pour le front-end), «HTML» est le langage de balisage de base ou principal que nous utilisons pour afficher les pages Web (la page que nous voyons sur un site Web). Parfois, dans une page HTML, avec l'autre affichage de contenu, nous devons également prendre certaines entrées utilisateur (en particulier dans les sites Web dynamiques). Et pour prendre les entrées utilisateur dans une page HTML, nous devons utiliser plusieurs éléments de formulaire pour créer ces formulaires correctement et à l'aide de ces formulaires, nous prenons les entrées utilisateur de manière correcte et mettons ces entrées (données) dans notre interne Bases de données en back-end. Maintenant, comme nous savons que les codes HTML sont écrits sous divers éléments de balise (), les «éléments de formulaire HTML» sont donc essentiellement les éléments utilisés à l'intérieur d'une balise «». Et ces éléments ainsi que d'autres attributs standard et uniques donnent également une forme et une structure qui permettent aux utilisateurs de savoir quoi faire avec la forme et comment procéder de manière structurelle.

Expliquer les éléments de formulaire HTML (y compris la syntaxe et les exemples avec sortie)

Étant donné qu'il existe plusieurs éléments de formulaire HTML pour créer un formulaire et lui donner un aspect approprié de manière structurée; ci-dessous sont certains d'entre eux expliqués un par un.

SL No.Mots clésSignifications / descriptions

1

Pour définir un formulaire HTML pour les entrées utilisateur

2

Pour définir le contrôle d'entrée

3

Pour spécifier une liste d'options prédéfinies

4

Pour définir des éléments liés au groupe

5

Pour définir une entrée sécurisée

6

Pour définir une étiquette d'entrée

sept

Pour définir une légende pour le jeu de champs

8

Pour définir un groupe d'options similaires

9

Pour définir une option pour la liste déroulante

dix

Pour définir un résultat

11

Pour définir une liste déroulante

12

Pour définir une zone de saisie multiligne

Remarque: La plupart des éléments de balise HTML abordés ici sont pour HTML5, qui est la dernière version du langage HTML. L'élément tag n'est plus pris en charge en HTML5; il était en fait utilisé pour la version antérieure de HTML.

Syntaxe et exemple

Certaines syntaxes et exemples d'éléments de formulaire HTML avec sorties sont décrits ci-dessous:

  1. Élément ""

Cet élément peut également contenir de nombreux autres éléments, notamment:

    Exemple pour un élément «» avec bouton d'entrée et de soumission:

    Syntaxe:


    Your Name:

    Codes:



    Your name:


    Production:

    1. Élément ""

    Cet élément est un élément en ligne et appartient au groupe d'éléments de formulaire.

    Syntaxe:


    Input name:
    Input age:

    Codes:



    Input name:
    Input age:


    Production:

    1. Élément ""

    Il spécifie généralement une liste prédéfinie d'entrées pour l'élément où les utilisateurs peuvent choisir n'importe quelle option dans la liste prédéfinie.

    Syntaxe:





    Codes:









    Production:

    1. Élément ""

    Cet élément est essentiellement utilisé pour regrouper des éléments liés dans des formulaires et dessine une boîte autour des éléments similaires.

    Syntaxe:


    Celebrity:
    Name:
    Phone:
    Age:

    Codes:




    Celebrity:
    Name:
    Phone:
    Age:

    Production:

    1. Élément ""

    Cet élément peut se situer en dehors du formulaire, mais il peut tout de même faire partie du formulaire. Généralement, cet élément est utilisé pour spécifier un ou plusieurs formulaires. Cet élément est nouvellement utilisé dans la version HTML5 pour générer une clé de chiffrement pour transmettre des données chiffrées sur un formulaire dans un site Web basé sur HTML.

    Syntaxe:

    Codes:



    Username:

    Le champ keygen mentionné ci-dessous est en dehors du formulaire, mais il fait toujours partie du formulaire ci-dessus.

    Chiffrement:

    Production:

    1. Élément ""

    Cet élément donne essentiellement un nom au formulaire de saisie pour que les utilisateurs comprennent de quelles données il s'agit. Il agit comme un indicateur pour les utilisateurs.

    Syntaxe:

    …

    Codes:


    Example of HTML label tag


    Boy
    Girl

    Production:

    1. Élément ""

    Cet élément définit en fait une légende pour un élément. C'est une sorte d'élément de support pour un autre élément, une partie de l'élément de groupe.

    Syntaxe:


    Celebrity:
    Name:
    Phone:
    Age:

    Codes:


    Example of HTML legend tag


    Celebrity:
    Name:
    Phone:
    Age:

    Production:

    1. Élément ""

    Cet élément est un élément lié au groupe qui est utilisé pour les options dans une liste déroulante dans un formulaire HTML. Il aide les utilisateurs à gérer facilement une longue liste.

    Syntaxe:


    Ninja 300
    Ninja 450

    Pulsar 200
    Pulsar 150

    Codes:



    Example of HTML legend tag


    Ninja 300
    Ninja 450

    Pulsar 200
    Pulsar 150

    Production:

    1. Élément ""

    Cet élément est utilisé pour représenter une option dans une liste déroulante sous élément; la liste déroulante doit contenir au moins une option.

    Syntaxe:

    …

    Codes:



    Example of HTML option tag


    Bikes
    Cars
    Buses

    Production:

    1. Élément ""

    Cet élément est essentiellement utilisé pour afficher la sortie d'un calcul (par exemple dans un calcul scripté).

    Syntaxe:

    …

    Codes:



    Example of HTML output Tag

    +
    =

    Production:

    1. Élément ""

    Cet élément est utilisé pour effectuer une sélection à partir d'une liste dans un formulaire.

    Syntaxe:


    Bike
    Car
    Bus

    Codes:



    Example of HTML select Tag


    Bike
    Car
    Bus

    Production:

    1. Élément ""

    Cet élément est utilisé pour définir des entrées de texte sur plusieurs lignes (par exemple pour l'adresse).

    Syntaxe:

    Mettez votre commentaire:
    Mettre ici…

    Codes:


    Example of HTML textarea Tag

    Mettez votre commentaire:
    Mettre ici…


    Production:

    Conclusion

    Il y a tellement d'éléments de formulaire HTML disponibles; dans cet article, nous avons discuté de certains des éléments de formulaire HTML de base ou natif. Les éléments de formulaire HTML nous aident à créer des formulaires HTML appropriés et fonctionnels. Il convient de noter que la plupart des éléments de formulaire HTML ont besoin de quelques attributs pour être inclus avec eux. Certains éléments dépendent les uns des autres et doivent être codés ensemble. Les éléments déjà obsolètes peuvent ne pas être affichés par tous les navigateurs.

    Articles recommandés

    Cela a été un guide pour les éléments de formulaire HTML. Nous discutons ici de l'introduction et des éléments du formulaire avec la syntaxe et un exemple de code. Vous pouvez également consulter nos autres articles suggérés pour en savoir plus -

    1. Versions de Html
    2. Avantages du HTML
    3. Carrière en HTML
    4. Blocs HTML
    5. Cours HTML gratuit
    6. Cadres HTML
    7. Définir une couleur d'arrière-plan en HTML avec l'exemple

    Catégorie:

    Outils de développement Web