Please wait...

search
close

## NORMAL TABLES

## BASIC TABLES Basic example without any additional modification classes

- more_vert

# | FIRST NAME | LAST NAME | USERNAME
--- | --- | --- | ---
1 | Mark | Otto | @mdo
2 | Jacob | Thornton | @fat
3 | Larry | the Bird | @twitter
4 | Larry | Jellybean | @lajelly
5 | Larry | Kikat | @lakitkat

## STRIPED ROWS Use `.table-striped` to add zebra-striping to any table row within the `<tbody>`

- more_vert

# | FIRST NAME | LAST NAME | USERNAME
--- | --- | --- | ---
1 | Mark | Otto | @mdo
2 | Jacob | Thornton | @fat
3 | Larry | the Bird | @twitter
4 | Larry | Jellybean | @lajelly
5 | Larry | Kikat | @lakitkat

## BORDERED TABLE Add `.table-bordered` for borders on all sides of the table and cells.

- more_vert

# | FIRST NAME | LAST NAME | USERNAME
--- | --- | --- | ---
1 | Mark | Otto | @mdo
2 | Jacob | Thornton | @fat
3 | Larry | the Bird | @twitter
4 | Larry | Jellybean | @lajelly
5 | Larry | Kikat | @lakitkat

## HOVER ROWS Add `.table-hover` to enable a hover state on table rows within a `<tbody>`.

- more_vert

# | FIRST NAME | LAST NAME | USERNAME
--- | --- | --- | ---
1 | Mark | Otto | @mdo
2 | Jacob | Thornton | @fat
3 | Larry | the Bird | @twitter
4 | Larry | Jellybean | @lajelly
5 | Larry | Kikat | @lakitkat

## CONDENSED TABLE Add `.table-condensed` to make tables more compact by cutting cell padding in half.

- more_vert

# | FIRST NAME | LAST NAME | USERNAME
--- | --- | --- | ---
1 | Mark | Otto | @mdo
2 | Jacob | Thornton | @fat
3 | Larry | the Bird | @twitter
4 | Larry | Jellybean | @lajelly
5 | Larry | Kikat | @lakitkat

## CONTEXTUAL CLASSES Use contextual classes to color table rows or individual cells.

- more_vert

# | FIRST NAME | LAST NAME | USERNAME
--- | --- | --- | ---
1 | Mark | Otto | @mdo
2 | Jacob | Thornton | @fat
3 | Larry | the Bird | @twitter
4 | Larry | Jellybean | @lajelly
5 | Larry | Kikat | @lakitkat

## WITH MATERIAL DESIGN COLORS You can use material design colors which examples are `.bg-pink`

- more_vert

# | FIRST NAME | LAST NAME | USERNAME
--- | --- | --- | ---
1 | Mark | Otto | @mdo
2 | Jacob | Thornton | @fat
3 | Larry | the Bird | @twitter
4 | Larry | Jellybean | @lajelly
5 | Larry | Kikat | @lakitkat