Sommaire

La structure de base CSS POUR LES FORMULAIRES:Structure des formulaires

1. Les classes .form-group et .form-control

Pour une mise en forme optimale, Bootstrap préconise de placer les éléments du formulaire dans des boîtes <div> utilisant la classe dédiée .form-group.

Puis, pour chaque élément <input> du formulaire, utilisez la classe dédiée .form-control.

Voilà un exemple de code utilisant ces deux classes :

<form role="form"> 
  <div class="form-group"> 
    <label for="lemail">Adresse mail</label> 
    <input type="email" class="form-control" id="lemail" 
placeholder="indiquez votre adresse mail"> 
  </div> 
  <div class="form-group"> 
    <label for="pw">Mot de passe</label> 
    <input type="password" class="form-control" id="pw" 
placeholder="Indiquez votre mot de passe"> 
  </div> 
  <div class="form-group"> 
    <label for="avatar">Votre avatar</label> 
    <input type="file" id="avatar"> 
    <p class="help-block">Sélectionnez un fichier dans votre 
ordinateur</p> 
  </div> 
  <div class="checkbox"> 
    <label>  ...