Derniers tutoriels de développement web
 

Bootstrap CSS Tables de référence


<table> Classes

Utilisez les classes ci-dessous pour coiffer une table:

Classe La description Exemple
.table Ajoute un style de base (rembourrage léger et seuls diviseurs horizontaux) à toute <table> Essayez - le
.table-striped Ajoute zebra-striping à une ligne du tableau dans les <tbody> (non disponible dans IE8) Essayez - le
.table-bordered Ajoute la frontière de tous les côtés de la table et les cellules Essayez - le
.table-hover Permet un état stationnaire sur les lignes de table dans un <tbody> Essayez - le
.table-condensed Fait tableau plus compact en coupant le remplissage des cellules dans la moitié Essayez - le
La combinaison de toutes les classes de table Essayez - le

<tr>, <th> et <td> Classes

Utilisez les classes ci-dessous pour la couleur des lignes de table ou de cellules:

Classe La description Exemple
.active Applique la couleur de vol stationnaire à une ligne ou une cellule particulière Essayez - le
.success Indique une action réussie ou positive Essayez - le
.info Indique un changement ou une action d'information neutre Essayez - le
.warning Indique un avertissement qui pourrait avoir besoin d'attention Essayez - le
.danger Indique une action dangereuse ou potentiellement négative Essayez - le

Tables Responsive

La classe .table sensible crée une table réactive. La table sera ensuite défiler horizontalement sur les petits appareils (sous 768px). Lors de la visualisation sur quoi que ce soit plus grand que 768px de large, il n'y a pas de différence:

Exemple

<div class="table-responsive">
  <table class="table">
    ...
  </table>
</div>
Essayez - le vous - même »