Comment construire entrées de style de texte pour votre HTML5 et CSS3 pages Web en fonction

La plupart des éléments de formulaire sur les pages web HTML5 et CSS3 sont des variantes de la même étiquette. La balise peut créer une seule ligne de texte, boîtes boîtes de mot de passe, des boutons, et le contenu même invisibles (tels que les champs cachés). La plupart de ces objets partageant les mêmes attributs de base, bien que l'aspect extérieur peut être différent.

Comment faire un champ de texte standard

La forme la plus commune de l'élément d'entrée est un plaine champ de texte.

Pour faire une entrée de texte de base, vous avez besoin d'une forme et un élément d'entrée. Ajout d'une étiquette de sorte que l'utilisateur sait ce qu'il est censé entrer dans la zone de texte est également fréquente. Voici le code:

Un élément d'entrée a trois attributs communs:

• type: La type attribut indique le type d'élément d'entrée est présent. Ce premier exemple séries type à texte, la création d'une zone de texte standard. Autres types de créer des mots de passe, les champs masqués, cases à cocher et des boutons.

• id: La id attribut crée un identifiant pour le domaine. Lorsque vous utilisez un langage de programmation pour extraire des données à partir de cet élément, l'utilisation id pour spécifier quel domaine vous faites allusion. Un id domaine commence souvent par une phrase de soupçon d'indiquer le type d'objet il est (par exemple, SMS indique une zone de texte).

  

• valeur: Cet attribut détermine la valeur par défaut de la boîte de texte. Si vous laissez cet attribut sur le champ de texte commence vide.

Les champs de texte peuvent aussi avoir d'autres attributs qui ne sont pas utilisés aussi souvent, comme

• taille: Cet attribut détermine le nombre de caractères qui sont affichés.

• longueur maximale: Utilisez cet attribut pour définir le plus grand nombre de caractères qui sont autorisés.

Il n'y a aucune balise. Les balises d'entrée sont un vestige de l'époque où de nombreuses balises ne possède pas de balise de fin. Vous venez de finir le tag original avec une barre oblique, comme le montre l'exemple de code précédent.

Vous pourriez vous demander pourquoi l'étiquette a été ajoutée si elle n'a pas d'effet sur l'apparence ou le comportement de la forme. Dans cet exemple particulier, la balise n'a pas d'effet, mais comme tout le reste en HTML, vous pouvez faire des choses étonnantes de style avec elle en CSS. Même si les étiquettes ne sont généralement pas un style par défaut, ils sont encore utiles.

Comment construire un champ de mot de passe

Les mots de passe sont comme des zones de texte, à l'exception du texte ne sont pas affichées. Au lieu de cela, une série d'astérisques apparaît.

Le code suivant révèle que les mots de passe sont presque identiques aux champs de texte ordinaires:

Dans cet exemple, un champ de mot de passe a été créé avec l'ID. La valeur par défaut de ce champ est. Le terme secret ne sera pas apparaître dans le fait de terrain, il sera remplacé par six caractères astérisque.

Le champ de mot de passe offre pratiquement aucune sécurité significatif. Il protège l'utilisateur des satellites espions regardant par-dessus son épaule pour lire un mot de passe, mais qui est à ce sujet. Les standards ouverts de HTML et les langages de programmation signifient les mots de passe sont souvent transmis à l'air libre. Il existe des solutions - telles que la technologie SSL - mais pour l'instant, juste être conscient que le champ de mot de passe ne convient pas à la protection de vos secrets.

Cet exemple ne pas vraiment faire quelque chose avec le mot de passe, mais vous allez utiliser d'autres technologies pour cela.

Comment faire de multi-ligne d'entrée de texte

Le champ de texte d'une seule ligne est une fonctionnalité puissante, mais parfois, vous voulez quelque chose d'un peu plus d'espace. Le programme montre comment vous pouvez créer une page pour une question de la dissertation.

La star de ce programme est une nouvelle étiquette -:

Voici quelques choses à garder à l'esprit lors de l'utilisation de la balise:

• Il doit anattribute, tout comme un élément d'entrée.

• Vous pouvez spécifier les withandattributes de taille.

• Le contenu va entre les balises. La zone de texte peut contenir beaucoup plus d'informations que les balises ordinaires, donc plutôt que de placer les données dans l'attribut, le contenu du texte va entre les balises et.

Ce qui est placé entre et dans le code se retrouve dans la sortie, aussi. Cela inclut les espaces et les retours chariot. Si vous ne voulez pas d'espace vide dans la zone de texte, placez le tag se terminant juste à côté de la balise de début.