Tables

  1. Home
  2. Tables

Basic Tables

Optional table caption.
# First Name Last Name Username Team
1 Mark Otto @mdo Black
2 Jacob Thornton @fat White
3 Larry the Bird @twitter White
4 Fred Tank @tank00 Green
5 Helen Hulk @h_hulk Red
6 Sash Ficus @ficus Green

Striped rows

Add zebra-striping to any table row within the tbody
# First Name Last Name Username Team
1 Mark Otto @mdo Black
2 Jacob Thornton @fat White
3 Larry the Bird @twitter White
4 Fred Tank @tank00 Green
5 Helen Hulk @h_hulk Red
6 Sash Ficus @ficus Green

Bordered table

Borders on all sides of the table and cells.
# First Name Last Name Username Team
1 Mark Otto @mdo Black
2 Jacob Thornton @fat White
3 Larry the Bird @twitter White
4 Fred Tank @tank00 Green
5 Helen Hulk @h_hulk Red
6 Sash Ficus @ficus Green

Hover rows

Hover state on table rows within a tbody.
# First Name Last Name Username Team
1 Mark Otto @mdo Black
2 Jacob Thornton @fat White
3 Larry the Bird @twitter White
4 Fred Tank @tank00 Green
5 Helen Hulk @h_hulk Red
6 Sash Ficus @ficus Green

Condensed table

Make tables more compact by cutting cell padding in half.
# First Name Last Name Username Team
1 Mark Otto @mdo Black
2 Jacob Thornton @fat White
3 Larry the Bird @twitter White
4 Fred Tank @tank00 Green
5 Helen Hulk @h_hulk Red
6 Sash Ficus @ficus Green

Contextual classes

Use contextual classes to color table rows or individual cells.
# First Name Last Name Username Team
1 Mark Otto @mdo Black
2 Jacob Thornton @fat White
3 Jacob Thornton @fat White
4 Jacob Thornton @fat White
5 Larry the Bird @twitter White
6 Jacob Thornton @fat White
7 Fred Tank @tank00 Green
8 Jacob Thornton @fat White
9 Helen Hulk @h_hulk Red
© 2015 Copyright

Members