Basic example
| Name | Position | Age | Salary |
|---|---|---|---|
| Tiger Nixon | System Architect | 47 | $320,80 |
| Garrett Winters | Accountant | 55 | $170,75 |
| Ashton Cox | Junior Technical Author | 41 | $186,00 |
<table class="table">
...
</table>
Striped rows
| Name | Position | Age | Salary |
|---|---|---|---|
| Tiger Nixon | System Architect | 47 | $320,80 |
| Garrett Winters | Accountant | 55 | $170,75 |
| Ashton Cox | Junior Technical Author | 41 | $186,00 |
<table class="table table-striped">
...
</table>
Bordered table
| Name | Position | Age | Salary |
|---|---|---|---|
| Tiger Nixon | System Architect | 47 | $320,80 |
| Garrett Winters | Accountant | 55 | $170,75 |
| Ashton Cox | Junior Technical Author | 41 | $186,00 |
<table class="table table-bordered">
...
</table>
Hover rows
| Name | Position | Age | Salary |
|---|---|---|---|
| Tiger Nixon | System Architect | 47 | $320,80 |
| Garrett Winters | Accountant | 55 | $170,75 |
| Ashton Cox | Junior Technical Author | 41 | $186,00 |
<table class="table table-hover">
...
</table>
Condensed table
| Name | Position | Age | Salary |
|---|---|---|---|
| Tiger Nixon | System Architect | 47 | $320,80 |
| Garrett Winters | Accountant | 55 | $170,75 |
| Ashton Cox | Junior Technical Author | 41 | $186,00 |
<table class="table table-condensed">
...
</table>
Contextual classes
| Name | Position | Age | Salary |
|---|---|---|---|
| Tiger Nixon | System Architect | 47 | $320,80 |
| Garrett Winters | Accountant | 55 | $170,75 |
| Ashton Cox | Junior Technical Author | 41 | $186,00 |
| Cedric Kelly | Senior Javascript Developer | 22 | $433,06 |
| Airi Satou | Accountant | 33 | $162,70 |
<!-- On rows -->
<tr class="active">...</tr>
<tr class="success">...</tr>
<tr class="warning">...</tr>
<tr class="danger">...</tr>
<tr class="info">...</tr>
<!-- On cells (`td` or `th`) -->
<tr>
<td class="active">...</td>
<td class="success">...</td>
<td class="warning">...</td>
<td class="danger">...</td>
<td class="info">...</td>
</tr>
Responsive tables
Create responsive tables by wrapping any .table in .table-responsive to make them scroll horizontally up to small devices (under 768px). When viewing on anything larger than 768px wide, you will not see any difference in these tables.
| Name | Position | Age | Salary |
|---|---|---|---|
| Tiger Nixon | System Architect | 47 | $320,80 |
| Garrett Winters | Accountant | 55 | $170,75 |
| Ashton Cox | Junior Technical Author | 41 | $186,00 |
<div class="table-responsive">
<table class="table">
...
</table>
</div>
