Bootstrap - Démo de formulaire
Disposition du formulaire
Bootstrap vous fournit les types suivants de dispositions de formulaire:
- Forme verticale (par défaut)
- Formulaire en ligne
- Forme horizontale
Forme verticale ou de base
La structure de base du formulaire est fournie avec Bootstrap; les contrôles de formulaire individuels reçoivent automatiquement un style global. Pour créer un formulaire de base, procédez comme suit -
Ajoutez un formulaire de rôle à l'élément <form> parent.
Enveloppez les étiquettes et les contrôles dans un <div> avec la classe .form-group . Ceci est nécessaire pour un espacement optimal.
Ajoutez une classe de .form-control à tous les éléments textuels <input>, <textarea> et <select>.
Formulaire en ligne
Pour créer un formulaire dans lequel tous les éléments sont en ligne, alignés à gauche et les étiquettes à côté, ajoutez la classe .form-inline à la balise <form>.
Forme horizontale
Les formes horizontales se distinguent des autres non seulement par le montant du balisage, mais également par la présentation du formulaire. Pour créer un formulaire qui utilise la disposition horizontale, procédez comme suit:
Ajoutez une classe de .form-horizontal à l'élément <form> parent.
Enveloppez les étiquettes et les contrôles dans un <div> avec la classe .form-group .
Ajoutez une classe de .control-label aux étiquettes.
| Exemple | La description | Lien de téléchargement |
|---|---|---|
| Page de connexion | Cet exemple indique la structure de la page de connexion dans Bootstrap | Télécharger |
| Page de contact | Cet exemple indique la structure de la page Contact dans Bootstrap | Télécharger |
| Inscription page | Cet exemple indique la structure de la page d'inscription dans Bootstrap | Télécharger |