Basic Tables

Basic tables
Basic table
Basic table with .table class.
# First Name Last Name Username
1 Jane Elliott #jane
2 Florence Douglas #florence
3 Eugine Turner #eugine
4 Ann Porter #ann
Striped rows table
Basic table with .table-striped class.
# First Name Last Name Username
1 Jane Elliott #jane
2 Florence Douglas #florence
3 Eugine Turner #eugine
4 Ann Porter #ann
Bordered table
Basic table with .table-bordered class.
# First Name Last Name Username
1 Jane Elliott #jane
2 Florence Douglas #florence
3 Eugine Turner #eugine
4 Ann Porter #ann
Hovered rows
Basic table with .table-hover class.
# First Name Last Name Username
1 Jane Elliott #jane
2 Florence Douglas #florence
3 Eugine Turner #eugine
4 Ann Porter #ann
Table Sizing
Extra large table
Basic table with .table-xlg class.
# First Name Last Name Username
1 Jane Elliott #jane
2 Florence Douglas #florence
3 Eugine Turner #eugine
4 Ann Porter #ann
Normal table
Basic table with .table class.
# First Name Last Name Username
1 Jane Elliott #jane
2 Florence Douglas #florence
3 Eugine Turner #eugine
4 Ann Porter #ann
Large table
Basic table with .table-lg class.
# First Name Last Name Username
1 Jane Elliott #jane
2 Florence Douglas #florence
3 Eugine Turner #eugine
4 Ann Porter #ann
Small table
Basic table with .table-sm class.
# First Name Last Name Username
1 Jane Elliott #jane
2 Florence Douglas #florence
3 Eugine Turner #eugine
4 Ann Porter #ann
Table borders
Vertical borders
Basic table with .table-columned class.
# First Name Last Name Username
1 Jane Elliott #jane
2 Florence Douglas #florence
3 Eugine Turner #eugine
4 Ann Porter #ann
Borderless table
Basic table with .table-borderless class.
# First Name Last Name Username
1 Jane Elliott #jane
2 Florence Douglas #florence
3 Eugine Turner #eugine
4 Ann Porter #ann
Table styling
Table header styling
Custom table header color with .bg-* class added to the header row.
# First Name Last Name Username
1 Jane Elliott #jane
2 Florence Douglas #florence
3 Eugine Turner #eugine
4 Ann Porter #ann
Contextual classes
Custom table with contextual classes added to individual table rows. To use contextual classes, add classes .success, .info, .warning, .danger to the individual table rows
# First Name Last Name Username Status
1 Jane Elliott #jane Active
2 Florence Douglas #florence Inactive
3 Eugine Turner #eugine Online
4 Ann Porter #ann Blocked
Color combination with dark header
Custom table color with class .bg-* added to .table class and .bg-*-600 to <thead> row.
# First Name Last Name Username
1 Jane Elliott #jane
2 Florence Douglas #florence
3 Eugine Turner #eugine
4 Ann Porter #ann
Table footer styling
Custom table footer color with .bg-* class added to the footer row.
1 Jane Elliott #jane
2 Florence Douglas #florence
3 Eugine Turner #eugine
4 Ann Porter #ann
# First Name Last Name Username
Custom table color
Custom table color with class .bg-* added to .table class.
# First Name Last Name Username
1 Jane Elliott #jane
2 Florence Douglas #florence
3 Eugine Turner #eugine
4 Ann Porter #ann
Colored table options
Custom table with background color and added classes .table-striped and .table-hover with .table class.
# First Name Last Name Username
1 Jane Elliott #jane
2 Florence Douglas #florence
3 Eugine Turner #eugine
4 Ann Porter #ann
Chats
user
Jane Elliott You just got LITT...
1:10 AM
4
user
Florence Douglas Wrong. You take the gun...
9:14 PM
23
user
Jacqueline Howell I was thinking that we...
Yesterday
user
Eugine Turner Mike, I know everything
Yesterday
user
Jane Elliott You just got LITT...
1:10 AM
4
user
Florence Douglas Wrong. You take the gun...
9:14 PM
23
user
Jacqueline Howell I was thinking that we...
Yesterday
user
Eugine Turner Mike, I know everything
Yesterday
user
Jane Elliott You just got LITT...
1:10 AM
4
user
Florence Douglas Wrong. You take the gun...
9:14 PM
23
user
Jacqueline Howell I was thinking that we...
Yesterday
user
Eugine Turner Mike, I know everything
Yesterday
user
Jane Elliott You just got LITT...
1:10 AM
4
user
Florence Douglas Wrong. You take the gun...
9:14 PM
23
user
Jacqueline Howell I was thinking that we...
Yesterday
user
Eugine Turner Mike, I know everything
Yesterday
user
Jane Elliott You just got LITT...
1:10 AM
4
user
Florence Douglas Wrong. You take the gun...
9:14 PM
23
user
Jacqueline Howell I was thinking that we...
Yesterday
user
Eugine Turner Mike, I know everything
Yesterday
chat

Sushi tonight?

10:14 am
chat

Pizza?

We had sushi last time!

For me one Vegetariana! Plus some chili oil on it!

10:15 am
chat

Done. Delivery takes 5 minutes!

10:16 am
chat

Awesome! See you later! : )

Just now