In this recipe, we will utilize default table-specific Bootstrap classes to achieve several variations on the same HTML structure.
Navigate to the recipe8
page of the chapter 3
website, and preview the final result that we are trying to achieve. To get this look, we will use several Bootstrap 4 classes, as follows:
.table-responsive
and.table
.table-striped
,.table-bordered
, and.table-hover
.table-inverse
,.table-warning
,.table-info
,.table-danger
,.table-success
, and.table-sm
.thead-default
and.thead-inverse
The basic HTML structure will be repeated several times, with changes involving the use of various combinations of the aforementioned Bootstrap 4 classes.