Tables

TABLES

You can create tables with basic styling that has horizontal dividers and small cell padding (8px by default),
by just adding the Bootstrap's class .table to the (table) element.

Basic Table
RowFirst NameLast NameEmail
1JohnCarterjohncarter@mail.com
2PeterParkerpeterparker@mail.com
3JohnRambojohnrambo@mail.com
4JunaDoejohnrambo@mail.com
5AleaSmithjohnrambo@mail.com
6ResaParkerjohnrambo@mail.com

Tables with Alternate Background (striped)
RowFirst NameLast NameEmail
1JohnCarterjohncarter@mail.com
2PeterParkerpeterparker@mail.com
3JohnRambojohnrambo@mail.com
4JunaDoejohnrambo@mail.com
5AleaSmithjohnrambo@mail.com
6ResaParkerjohnrambo@mail.com

Table with Borders
RowFirst NameLast NameEmail
1JohnCarterjohncarter@mail.com
2PeterParkerpeterparker@mail.com
3JohnRambojohnrambo@mail.com
4JunaDoejohnrambo@mail.com
5AleaSmithjohnrambo@mail.com
6ResaParkerjohnrambo@mail.com

Hover State on Table Rows
RowFirst NameLast NameEmail
1JohnCarterjohncarter@mail.com
2PeterParkerpeterparker@mail.com
3JohnRambojohnrambo@mail.com
4JunaDoejohnrambo@mail.com
5AleaSmithjohnrambo@mail.com
6ResaParkerjohnrambo@mail.com

Condensed Table
RowFirst NameLast NameEmail
1JohnCarterjohncarter@mail.com
2PeterParkerpeterparker@mail.com
3JohnRambojohnrambo@mail.com
4JunaDoejohnrambo@mail.com
5AleaSmithjohnrambo@mail.com
6ResaParkerjohnrambo@mail.com

Emphasis Classes on Table Rows
ClassDescription
.activeApplies the hover color to a particular row or cell
.successIndicates a successful or positive action
.infoIndicates a neutral informative change or action
.warningIndicates a warning that might need attention
.dangerIndicates a dangerous or potentially negative action

#Column headingColumn headingColumn heading
1Column contentColumn contentColumn content
2Column contentColumn contentColumn content
3Column contentColumn contentColumn content
4Column contentColumn contentColumn content
5Column contentColumn contentColumn content
6Column contentColumn contentColumn content
7Column contentColumn contentColumn content
8Column contentColumn contentColumn content
9Column contentColumn contentColumn content