Bootstrap's des paramètres par défaut
Individuels contrôles de formulaire reçoivent automatiquement un peu de style global avec Bootstrap .
Tous les textes <input>, <textarea> , et <select> éléments avec class="form-control" sont mis à la largeur: 100%; par défaut.
Règles standard pour Bootstrap formes:
- Ajouter role="form" à la balise <form> élément (aide à améliorer l' accessibilité pour les personnes utilisant des lecteurs d'écran)
- Enveloppez les étiquettes et les contrôles de formulaire dans un <div> élément avec class="form-group" (nécessaire pour l' espacement optimal)
- Ajouter class="form-control" à tous textuelle <input>, <textarea> , et <select> éléments
L'exemple suivant crée une forme de Bootstrap simple avec deux champs de saisie, une case à cocher, et un bouton de soumission:
Bootstrap Exemple de formulaire
<form role="form">
<div class="form-group">
<label for="email">Email address:</label>
<input
type="email" class="form-control" id="email">
</div>
<div class="form-group">
<label
for="pwd">Password:</label>
<input type="password"
class="form-control" id="pwd">
</div>
<div class="checkbox">
<label><input type="checkbox">
Remember me</label>
</div>
<button type="submit" class="btn btn-default">Submit</button>
</form> Essayez - le vous - même » <form> Classes
| Classe | La description | Exemple |
|---|---|---|
| .form-inline | Fait un <form> aligné à gauche avec des commandes en ligne-bloc (Ceci ne concerne que les formes dans les viewports qui sont au moins 768px de large) | Essayez - le |
| .form-horizontal | Aligne les étiquettes et les groupes de contrôles de formulaire dans une disposition horizontale | Essayez - le |