Skip to main content

Tables

Documentation and examples for styling tables.

Default style

# First Last Handle
1 Mark Otto @mdo
2 Jacob Thornton @fat
3 Larry the Bird @twitter
<table class="table">
<thead class="table-light">
<tr>
<th class="border-0" scope="col">#</th>
<th class="border-0 text-uppercase" scope="col">First</th>
<th class="border-0 text-uppercase" scope="col">Last</th>
<th class="border-0 text-uppercase" scope="col">Handle</th>
</tr>
</thead>
<tbody>
<tr>
<th scope="row">1</th>
<td>Mark</td>
<td>Otto</td>
<td>@mdo</td>
</tr>
...
</tbody>
</table>

Color table

Change the color of the table using .table-{color}.

# First Last Handle
1 Mark Otto @mdo
2 Jacob Thornton @fat
3 Larry the Bird @twitter
<table class="table table-primary">
<thead>
<tr>
<th scope="col">#</th>
<th class="text-uppercase" scope="col">First</th>
<th class="text-uppercase" scope="col">Last</th>
<th class="text-uppercase" scope="col">Handle</th>
</tr>
</thead>
<tbody>
<tr>
<th scope="row">1</th>
<td>Mark</td>
<td>Otto</td>
<td>@mdo</td>
</tr>
...
</tbody>
</table>

Bootstrap Documentation