Horizontal Borders
Example of horizontal table borders. This is a default table border style attached to .table class. All borders have the same grey color and style, table itself doesn't have a border, but you can add this border using .table-framed class added to the table with .table class.
# First Name Last Name Username
1 Mark Otto @mdo
2 Jacob Thornton @fat
3 Larry the Bird @twitter
Vertical Borders
Example of horizontal table borders. This is a default table border style attached to .table class. All borders have the same grey color and style, table itself doesn't have a border, but you can add this border using .table-framed class added to the table with .table class.
# First Name Last Name Username
1 Mark Otto @mdo
2 Jacob Thornton @fat
3 Larry the Bird @twitter
Both Borders
Example of horizontal table borders. This is a default table border style attached to .table class. All borders have the same grey color and style, table itself doesn't have a border, but you can add this border using .table-framed class added to the table with .table class.
# First Name Last Name Username
1 Mark Otto @mdo
2 Jacob Thornton @fat
3 Larry the Bird @twitter
Borderless Table
Example of horizontal table borders. This is a default table border style attached to .table class. All borders have the same grey color and style, table itself doesn't have a border, but you can add this border using .table-framed class added to the table with .table class.
# First Name Last Name Username
1 Mark Otto @mdo
2 Jacob Thornton @fat
3 Larry the Bird @twitter
Default Table Border
Example of a default thead border. This border has 1px width and slightly darker color than other borders for better visual separation of table head and table body. Vertical cell borders in the table head always have the same color as borders in table body.
# First Name Last Name Username
1 Mark Otto @mdo
2 Jacob Thornton @fat
3 Larry the Bird @twitter
Border Bottom Color
Example of a table head border with custom color. According to the custom color system options, you can set any of predefined colors by adding .border-bottom-* class to the table head row. This technique works with all border styles demonstrated above.
# First Name Last Name Username
1 Mark Otto @mdo
2 Jacob Thornton @fat
3 Larry the Bird @twitter