Application de styles aux tables avec Twitter Bootstrap

Est-ce que quelqu’un sait s’il est possible d’appliquer des styles sur les tables avec Twitter Bootstrap? Je peux voir quelques exemples de tables dans certains anciens tutoriels, mais pas sur le site Bootstrap lui-même.

J’ai essayé de le configurer mais les tableaux de ma page ne sont quasiment pas appliqués.

# First Name Last Name Language
1 Some One English
2 Joe Sixpack English

Quelles classes dois-je appliquer?

Bootstrap propose différents styles de table. Jetez un coup d’œil à Base CSS – Tables pour documentation et exemples.

Le style suivant donne de superbes tableaux:

  ... 

Les tables de bootstrap Twitter peuvent être stylées et bien conçues. Vous pouvez styler votre table en ajoutant simplement des classes sur votre table et cela sera beau. Vous pouvez l’utiliser sur vos rapports de données, afficher des informations, etc.

entrer la description de l'image ici Vous pouvez utiliser :

 basic table Ssortingped rows Bordered table Hover rows Condensed table Contextual classes Responsive tables 

Lignes rayées Table:

  
# Name Address mail
1 Thomas bell Brick lane, London thomas@yahoo.com
2 Yan Chapel Toronto Australia Yan@yahoo.com
3 Pit Sampras Berlin, Germany Pit @yahoo.com

Table condensée:

Compacter une table, vous devez append la classe class = “table table-condensed”.

  
# Sample Name Address Mail
1 Thomas bell Brick lane, London thomas@yahoo.com
2 Yan Chapel Toronto Australia Yan@yahoo.com
3 Pit Sampras Berlin, Germany Pit @yahoo.com

Réf: http://twitterbootstrap.org/twitter-bootstrap-table-example-tutorial

Vous pouvez également appliquer des classes TR: info, error, warning ou success.

Juste une autre bonne table. J’ai ajouté la classe “table-hover” car cela donne un bel effet de vol stationnaire.

  

NATO Phonetic Alphabet

Letter Phonetic Letter
A Alpha
B Bravo
C Charlie

bootstrap fournit diverses classes pour la table

  

Vous pouvez append des classes contextuelles à chaque ligne comme suit:

      

Vous pouvez également les append aux données de la table comme ci-dessus

Vous pouvez définir la taille de votre table en définissant les classes comme table-sm , etc.

Vous pouvez append des classes personnalisées et append votre propre style:

 
First Name Last Name
Asdf qwerty

De cette façon, vous pouvez append un style personnalisé. J’ai montré un style en ligne, par exemple, comment cela fonctionne, vous pouvez également append des classes et les appeler dans votre css.