Comment créer une zone de saisie de texte multiligne dans un formulaire de saisie ? Un article vous apprend à utiliser les balises d'entrée

Cet article explique principalement comment créer une interface de connexion avec une balise d'entrée HTML, comprenant une zone de texte, une zone de mot de passe, un bouton radio, une zone de sélection multiple, un bouton de soumission et de réinitialisation. Les instructions d'utilisation expliquent complètement le. détails d'utilisation des balises d'entrée de formulaire HTML. Jetons maintenant un coup d'œil à cet article

1. Tout d'abord, voyons comment créer une zone de texte :

<form action="url地址" method=“get/post” name="表单名称">
<p>这是文本框</p>
用户名：<input type="text" name="username">

Un nom d'utilisateur de base comme celui-ci La zone de texte apparaît, jetons un coup d'œil à l'effet :

Comme indiqué ci-dessus, il s'agit d'une zone de saisie pour le nom d'utilisateur. Vous est-elle familière ? ceci. Mais ils ont ajouté beaucoup d'autres éléments pour rendre la forme plus belle, ce que nous découvrirons plus tard. (Si vous voulez en voir plus, rendez-vous sur Cours vidéo en ligne HTML sur le site Web chinois php)

2. Parlons maintenant de la façon de créer une boîte de mot de passe :

Nous savons que les mots de passe relèvent de la vie privée. Tout le monde ne veut pas que son mot de passe soit vu par les autres lorsqu'il le saisit, donc fondamentalement, les mots de passe saisis dans la zone de mot de passe de tous les sites Web sont confidentiels. avec un astérisque ou affiché sous forme de petits points.

Voyons maintenant comment créer la zone de mot de passe de cette balise d'entrée.

<form action="url地址" method=“get/post” name="表单名称">
<p>这是文本框</p>
用户名：<input type="text" name="username">

密   码：

Comme le montre le code ci-dessus, nous devrions pouvoir deviner à quoi cela sert. Jetons d'abord un coup d'œil au rendu :

Regardez, si sans ces trois espaces, le mot de passe et le nom d'utilisateur ne seront pas alignés. Généralement, ils sont alignés à l'aide de feuilles de style en cascade, mais maintenant nous ne parlons que de HTML, pas encore de CSS, donc maintenant j'utilise trois espaces. Le mot de passe avec le nom d'utilisateur est également le moyen le plus simple.

C'est peut-être parce que l'éditeur souffre de trouble obsessionnel-compulsif. Quoi qu'il en soit, ce genre d'effet peut être vu par n'importe qui. S'il n'est pas aligné, ce sera beaucoup plus laid.

3. Maintenant que nous avons fini de lire la boîte de mot de passe, voyons comment créer la boîte de boutons radio :

Ici, nous prendrons le single- sélectionnez mâle et femelle comme exemple (bien sûr la première je ne parlerai pas de la troisième catégorie)

<form action="url地址" method=“get/post” name="表单名称">
<p>这是文本框</p>
用户名：<input type="text" name="username">

密   码：
单选框
单选：男
      女

Voyons l'effet

Il s'agit du bouton radio, qui est également un cadre couramment utilisé. Vous ne pouvez choisir qu'un seul homme ou une seule femme, pas les deux.

4. Maintenant que vous avez le bouton radio, parlons de la boîte de sélection multiple :

<form action="url地址" method=“get/post” name="表单名称">
<p>这是文本框</p>
用户名：<input type="text" name="username">

密   码：
单选框
单选：男
      女
多选框
多选：吃饭
      睡觉
      打豆豆
      喝水

L'effet est comme indiqué ci-dessous

Dans cette image, toutes les choses ci-dessus sont sélectionnées et les multiples cases de sélection peuvent être sélectionnées. Bien sûr, vous pouvez également en définir une pour qu'elle soit sélectionnée par défaut. l'attribut vérifié="checked", qui Les ajouts dans la zone de sélection multiple peuvent être affichés dès que la page Web est actualisée. C'est l'effet de la sélection par défaut.

5. Cela dit, parlons du bouton de soumission finale et du bouton de réinitialisation :

Ces deux boutons sont très importants. Le bouton de réinitialisation peut restaurer les choses. sélectionnés ou renseignés sur votre page Web dans leur état d'origine en un seul clic. Soumettre consiste à soumettre tous vos éléments remplis et sélectionnés au backend. Regardons le code ci-dessous :

<form action="url地址" method=“get/post” name="表单名称">
<p>这是文本框</p>
用户名：<input type="text" name="username">

密   码：
单选框
单选：男
      女
多选框
多选：吃饭
      睡觉
      打豆豆
      喝水
重置按钮
重置：
提交按钮
提交：

Comme il n'y a pas de backend, l'adresse du backend n'est pas renseignée. Cependant, cela n'affecte pas l'effet

Il s'agit de la plupart des fenêtres permettant de remplir l'inscription sur une seule page. C'est très simple. La plupart des éléments ci-dessus apparaissent. formes fixes. Il existe des attributs individuels qui seront progressivement appris dans le futur. (Si vous voulez en voir plus, bienvenue sur

www.php.cnSite Web PHP chinois)

Cet article se termine ici Le code ci-dessus ne peut devenir parfait qu'avec plus de pratique. Vous pouvez poser des questions ci-dessous

【Recommandation de l'éditeur】

Comment insérer du texte dans les balises et supprimer les balises de texte del ensemble en HTML ? (Avec exemples)

Quelle est la fonction de la balise form en HTML ? Explication de l'utilisation de la balise de formulaire HTML

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!