Navigation
Theme components
Form components
Apps
Other
Documentation
Contextual classes
Add the .table-{color} class to the <tr> element for coloured table rows.
| Name | Country | Company |
|---|---|---|
| Lucas smith | Australia | Apple, Inc. |
| Janet Abshire | USA | |
| Lucas Koch | England | |
| Gladys Schuster | USA | Coursera |
| George Clinton | Canada | |
| Jennifer Weber | New Zealand | Lyft |
Table head colors
Use the .table class for default table styling.
| Name | Ticker | Price |
|---|---|---|
| Apple Inc. | AAPL | 115.52 |
| Google Inc. | GOOG | 635.30 |
| Microsoft Corporation | MSFT | 46.74 |
| LinkedIn Corp | LNKD | 190.04 |
| Name | Ticker | Price |
|---|---|---|
| Apple Inc. | AAPL | 115.52 |
| Google Inc. | GOOG | 635.30 |
| Microsoft Corporation | MSFT | 46.74 |
| LinkedIn Corp | LNKD | 190.04 |
| Name | Ticker | Price |
|---|---|---|
| Apple Inc. | AAPL | 115.52 |
| Google Inc. | GOOG | 635.30 |
| Microsoft Corporation | MSFT | 46.74 |
| LinkedIn Corp | LNKD | 190.04 |
| Name | Ticker | Price |
|---|---|---|
| Apple Inc. | AAPL | 115.52 |
| Google Inc. | GOOG | 635.30 |
| Microsoft Corporation | MSFT | 46.74 |
| LinkedIn Corp | LNKD | 190.04 |
| Name | Ticker | Price |
|---|---|---|
| Apple Inc. | AAPL | 115.52 |
| Google Inc. | GOOG | 635.30 |
| Microsoft Corporation | MSFT | 46.74 |
| LinkedIn Corp | LNKD | 190.04 |
| Name | Ticker | Price |
|---|---|---|
| Apple Inc. | AAPL | 115.52 |
| Google Inc. | GOOG | 635.30 |
| Microsoft Corporation | MSFT | 46.74 |
| LinkedIn Corp | LNKD | 190.04 |
| Name | Ticker | Price |
|---|---|---|
| Apple Inc. | AAPL | 115.52 |
| Google Inc. | GOOG | 635.30 |
| Microsoft Corporation | MSFT | 46.74 |
| LinkedIn Corp | LNKD | 190.04 |
| Name | Ticker | Price |
|---|---|---|
| Apple Inc. | AAPL | 115.52 |
| Google Inc. | GOOG | 635.30 |
| Microsoft Corporation | MSFT | 46.74 |
| LinkedIn Corp | LNKD | 190.04 |
Table hover using primary color
Use the .table-hover with the .table-hover-primary class to add hover functionality using the primary color
| Name | Ticker | Price |
|---|---|---|
| Apple Inc. | AAPL | 115.52 |
| Google Inc. | GOOG | 635.30 |
| Microsoft Corporation | MSFT | 46.74 |
| LinkedIn Corp | LNKD | 190.04 |
Table hover using secondary color
Use the .table-hover with the .table-hover-secondary class to add hover functionality using the secondary color
| Name | Ticker | Price |
|---|---|---|
| Apple Inc. | AAPL | 115.52 |
| Google Inc. | GOOG | 635.30 |
| Microsoft Corporation | MSFT | 46.74 |
| LinkedIn Corp | LNKD | 190.04 |
Table hover using info color
Use the .table-hover with the .table-hover-info class to add hover functionality using the info color
| Name | Ticker | Price |
|---|---|---|
| Apple Inc. | AAPL | 115.52 |
| Google Inc. | GOOG | 635.30 |
| Microsoft Corporation | MSFT | 46.74 |
| LinkedIn Corp | LNKD | 190.04 |
Table hover using success color
Use the .table-hover with the .table-hover-success class to add hover functionality using the success color
| Name | Ticker | Price |
|---|---|---|
| Apple Inc. | AAPL | 115.52 |
| Google Inc. | GOOG | 635.30 |
| Microsoft Corporation | MSFT | 46.74 |
| LinkedIn Corp | LNKD | 190.04 |
Table hover using warning color
Use the .table-hover with the .table-hover-warning class to add hover functionality using the warning color
| Name | Ticker | Price |
|---|---|---|
| Apple Inc. | AAPL | 115.52 |
| Google Inc. | GOOG | 635.30 |
| Microsoft Corporation | MSFT | 46.74 |
| LinkedIn Corp | LNKD | 190.04 |
Table hover using danger color
Use the .table-hover with the .table-hover-danger class to add hover functionality using the danger color
| Name | Ticker | Price |
|---|---|---|
| Apple Inc. | AAPL | 115.52 |
| Google Inc. | GOOG | 635.30 |
| Microsoft Corporation | MSFT | 46.74 |
| LinkedIn Corp | LNKD | 190.04 |