Referenz zu Bootstrap- CSS-Tabellen


<Tabelle> Klassen

Verwenden Sie die folgenden Klassen, um Tabellen zu formatieren: 

Class Description Example
.table Adds basic styling (light padding and only horizontal dividers) to any <table>
.table-striped Adds zebra-striping to any table row within <tbody> (not available in IE8)
.table-bordered Adds border on all sides of the table and cells
.table-hover Enables a hover state on table rows within a <tbody>
.table-condensed Makes table more compact by cutting cell padding in half
Combining all the table classes

Klassen <tr>, <th> und <td>

Verwenden Sie die folgenden Klassen, um Tabellenzeilen oder -zellen einzufärben:

Class Description Example
.active Applies the hover color (light-grey) to a particular row or cell
.success Indicates a successful or positive action
.info Indicates a neutral informative change or action
.warning Indicates a warning that might need attention
.danger Indicates a dangerous or potentially negative action

Responsive Tabellen

Die Klasse .table-responsive erstellt eine responsive Tabelle. Auf kleinen Geräten (unter 768px) scrollt die Tabelle dann horizontal. Bei der Anzeige auf etwas, das breiter als 768 Pixel ist, gibt es keinen Unterschied:

Beispiel

<div class="table-responsive">
  <table class="table">
    ...
  </table>
</div>