Referencia de tablas CSS de Bootstrap
<tabla> Clases
Use las clases a continuación para diseñar cualquier tabla:
| 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 | ||
Clases <tr>, <th> y <td>
Use las clases a continuación para colorear las filas o celdas de la tabla:
| 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 |
Tablas receptivas
La clase .table-responsive crea una tabla receptiva. La tabla luego se desplazará horizontalmente en dispositivos pequeños (menos de 768 px). Cuando se ve en algo más grande que 768 px de ancho, no hay diferencia:
Ejemplo
<div class="table-responsive">
<table class="table">
...
</table>
</div>