HTML

Utilisation des éléments <input>, <textarea>, <select> et <button>

Utilisation des éléments <input>, <textarea>, <select> et <button>


Dans un formulaire HTML, différents éléments sont utilisés pour collecter des données de l'utilisateur. Voici comment utiliser ces éléments :


1. Balise <input> :


  • La balise <input> est utilisée pour créer des champs de saisie de données tels que des champs de texte, des cases à cocher, des boutons radio, etc.
  • L'attribut type définit le type de champ d'entrée.
  • Exemples :


<!-- Champ de texte -->
<input type="text" name="nom" id="nom">
<!-- Case à cocher -->
<input type="checkbox" name="newsletter" id="newsletter">
<!-- Bouton radio -->
<input type="radio" name="genre" value="homme"> Homme
<input type="radio" name="genre" value="femme"> Femme


2. Balise <textarea> :


  • La balise <textarea> est utilisée pour créer un champ de texte multiligne, permettant aux utilisateurs de saisir un texte plus long.
  • Vous pouvez définir le nombre de lignes et de colonnes à afficher.
  • Exemple :


<textarea name="message" id="message" rows="4" cols="50"></textarea>


3. Balise <select> :


  • La balise <select> est utilisée pour créer une liste déroulante (menu select).
  • Les options disponibles sont définies à l'intérieur de la balise <select> avec des balises <option>.
  • Exemple :


<select name="pays" id="pays">
  <option value="france">France</option>
  <option value="espagne">Espagne</option>
  <option value="italie">Italie</option>
</select>


4. Balise <button> :


  • La balise <button> est utilisée pour créer un bouton dans un formulaire.
  • Vous pouvez utiliser les attributs type pour définir le type de bouton (submit, reset, button).
  • Exemple :


<button type="submit">Envoyer</button>
<button type="reset">Effacer</button>
<button type="button">Cliquer</button>


Conseils d'utilisation :


  • Utilisez <input> pour les champs de saisie simples comme les champs de texte, les cases à cocher et les boutons radio.
  • Utilisez <textarea> pour les champs de texte multilignes.
  • Utilisez <select> pour les menus déroulants.
  • Utilisez <button> pour créer des boutons dans le formulaire.


Conclusion :


En utilisant les balises <input>, <textarea>, <select> et <button> dans votre fichier HTML, vous pouvez créer des formulaires interactifs pour collecter divers types de données auprès des utilisateurs. Assurez-vous d'utiliser ces éléments de manière appropriée en fonction des besoins de votre formulaire.

750 vues
Posté le 20 février 2024
Publicité Sitedudev
Cette pub permet au site de vivre ...
Publicité
Cette pub permet au site de vivre ...
Voir d'autres articles
4 676 vues
Créer sa première page
Attention ! ⚠️ À partir de ce cours je ne détaillerais plus comme le cours précédent.À la place il sera expliqué ce que la vidéo va vous apporter et .. comme toujours le code sera...
Créer son site de rencontres
805 vues
Portée des variables (variables locales et globales)
La portée des variables en PHP fait référence à la visibilité et à l'accès des variables à différents endroits dans un script PHP. Il existe deux types principaux de portée des variables :...
PHP
3 072 vues
Se connecter en PHP
Nous allons dans cette vidéo créer un formulaire PHP afin de nous connecter à notre site web.Pour cela nous allons utiliser la combinaison mail + mot de passe afin de nous connecter.Nous allons...
Créer son site de rencontres
6 589 vues
Créer son forum
Après avoir terminer les articles pour développer votre site de A à Z maintenant nous allons nous attaquer à la création d'un forum complet !Pour commencer nous allons...
Créer son site
2 375 vues
Envoyer un message sans recharger la page (1/2)
Nous allons améliorer notre messagerie interne vu que nous pouvons désormais envoyer et recevoir des messages.Pour cela nous allons utiliser du JavaScript avec de l'Ajax afin de faire des...
Créer son site de rencontres
711 vues
Utilisation des blocs try...catch
Utilisation des Blocs try...catch en JavaScriptLes blocs try...catch en JavaScript permettent de gérer les erreurs potentielles qui peuvent survenir lors de l'exécution d'un bloc de code. Ils...
JS
4 282 vues
Afficher un topic
Afficher un topic de notre forumDans notre dossier f_forum, nous allons créer une nouvelle page topic.php. Cette page affichera le topique créé par un de vos utilisateur.Nous allons...
Créer son site
622 vues
Retour de valeurs avec return
En PHP, la fonction return est utilisée pour renvoyer une valeur depuis une fonction. Cela permet à une fonction d'effectuer des calculs ou des traitements sur des données et de renvoyer le...
PHP
Publicité
Cette pub permet au site de vivre ...