Bootstrap provides a nice and clean layout for building tables. If you want some light padding and horizontal dividers, add the base class: .table. Along with the base table class, you can use additional classes to style the table.
.table-striped
Adds zebra-stripes to a table
.table-bordered
Adds borders on all sides of the table and cells
.table-borderless
Add .table-borderless for a table without borders.
.table-hover
Adds a hover effect (grey background color) on table rows
.table-sm
Makes a table more compact by reducing cell padding in half
Contextual Classes
Contextual classes can be used to color table rows (<tr> or <th>) or table cells (<td>).
1. Table
.table {
width: 100%;
margin-bottom: 1rem;
color: #212529;
}
2. Table Bordered
.table-bordered {
border: 1px solid #dee2e6;
}