Basic Tables
Using the most basic table markup, here’s how
.table based tables look in Bootstrap.
All table styles are inherited from Bootstrap 4, meaning any nested tables will be styled in the same
manner as the parent.
Bootstrap Tables Structure
<table class="table">
<thead>
<tr>
<th>#</th>
<th>Username</th>
</tr>
</thead>
<tbody>
<tr>
<th scope="row">1</th>
<td>Mark</td>
</tr>
<tr>
<th scope="row">2</th>
<td>Jacob</td>
</tr>
</tbody>
</table>
Tables List
| Bootstrap Tables Options | Class | Description |
|---|---|---|
| Inverse table | .table-inverse |
You can also invert the colors—with light text on dark backgrounds using this class. |
| Table Striped | .table-striped |
Use .table-striped to add zebra-striping
to any table row within the <tbody>
|
| Bordered Table | .table-bordered |
Add .table-bordered for borders on all
sides of the table and cells.
|
| Borderless Table | .table-borderless |
Add .table-borderless for a table without
borders.
|
| Hoverable rows | .table-hover |
Add .table-hover to enable a hover state
on table rows within a
<tbody>.
|
| Responsive tables | .table-responsive |
Wrap .table with
.table-responsive to get responsive
table.
|
Refer following links for usage:
| Type | URL |
|---|---|
| Plugin Link | https://getbootstrap.com/docs/4.5/content/tables/ |
| Template Page | https://pixinvent.com/frest-clean-bootstrap-admin-dashboard-template/html/ltr/vertical-menu-template/table.html |