Boutons dans les formulaires
Fait partie de la section Fundamentals du Journey HTML de Coddy. Leçon 45 sur 60.
Les boutons jouent un rôle clé dans les formulaires, où ils aident à soumettre des données ou à réinitialiser des champs. Voyons comment ils fonctionnent :
Bouton de soumission :
<form>
<input type="text" name="username" placeholder="Enter username">
<button type="submit">Submit</button>
</form>
type="submit": Envoie les données du formulaire au serveur.
Bouton de réinitialisation :
<form>
<input type="text" name="name" value="John Doe">
<button type="reset">Reset</button>
</form>
type="reset": Efface tous les champs et les réinitialise à leurs valeurs par défaut.
Défi
FacileCréez un document HTML qui inclut un formulaire avec différents types de boutons. Le formulaire doit comporter les éléments suivants :
- Un champ de saisie de texte avec le name "message" et un placeholder qui indique "Enter your message".
- Ajoutez un bouton de soumission (
<button type="submit">) avec le texte "Send". - Ajoutez un bouton de réinitialisation (
<button type="reset">) avec le texte "Clear". - Ajoutez un bouton générique (
<button>) avec le texte "Click Me".
Essayez vous-même
<!DOCTYPE html>
<html>
<body>
<!-- Écrivez votre code ici -->
</body>
</html>
Testez-vousCette leçon comprend un petit quiz. Commencez la leçon pour y répondre et suivre votre progression.
Toutes les leçons de Fundamentals
1Les bases du HTML
Qu'est-ce que le HTML ?Structure de base du HTMLBalises et élémentsImbrication et fermeture des balisesCommentaires en HTML7Page de profil personnel
Présentation du projetSection d'en-tête
Photo de profilSection À propos de moiLiens sociaux2Texte et mise en forme
TitresParagraphesSauts de ligneTexte en gras et italiqueGras et italique (suite)Récapitulatif - Mise en forme8Formulaires et champs de saisie, partie 1
Bases des formulairesChamps de texteAttributs des champsChamp de mot de passeLibellés pour les champsRécapitulatif - Formulaire de base11Page d'inscription à un événement
Aperçu du projetSection d'en-têteSection des détails de l'événementFormulaire d'inscriptionSection de pied de page3Travailler avec les listes
Liste non ordonnéeListe ordonnéeListes imbriquéesRécapitulatif - Les listes6Mise en page
DivisionsSpans en ligneBalises sémantiquesSections et articlesRécapitulatif - Mise en page9Formulaires et entrées, partie 2
Boutons radioCases à cocherListes déroulantesBoutonsBoutons dans les formulairesRécapitulatif - Formulaires n°1Récapitulatif - Formulaires n°2Entraînez-vous par vous-même : Playground Web