Example of a basictable. For basic styling (light padding and only horizontal dividers) add the base class .tableto any <table>. It may seem super redundant, but given the widespread use of tables for other plugins like calendars and date pickers, we've opted to isolate our custom table styles.

Example of a table with stripedrows. Use .table-stripedadded to the base .tableclass to add zebra-striping to any table odd row within the <tbody>. This styling doesn't work in IE8 and lower as :nth-childCSS selector isn't supported in these browser versions. Striped table can be combined with other table styles.

Example of a table with fully borderedcells. Add .table-borderedto the base .tableclass for borders on all sides of the table and cells. This is a default Bootstrap option for the table, for more advanced border options check Table borderspage. Bordered table can be combined with other table styles.

Example of a borderedtable with stipedrows. Add .table-borderedand .table-stripedclasses to the base .tableclass for borders and row striping. This method works with all table border options.

Example of a table with hoverrows state. Add .table-hoverto enable a hover state on table rows within a <tbody>.

Example of a scrollabletable. To use a fixed height with scrolling, wrap any table in a div with .table-scrollableclass. Max height of the table container will be 22.5remand table will get a vertical scrollbar if its height exceeds this value.

Example of a table placed inside card body. Such tables always have additional whitespace taken from .card-bodyelement padding.

Example of framedtable inside card body. Tables that placed inside card body don't have border around them by default, .table-framedclass adds border around the table.

Example of bordered framedtable inside card body. By default bordered table also doesn't have a border, to use border around the bordered table add .table-framedto the <table>.