Basic Table
Just add the base class .tableto any <table>.
|
#
|
First Name
|
Last Name
|
Username
|
Role
|
Country
|
|
1
|
Alexander
|
Orton
|
@mdorton
|
Admin
|
USA
|
|
2
|
John Deo
|
Deo
|
@johndeo
|
User
|
USA
|
|
3
|
Randy Orton
|
the Bird
|
@twitter
|
admin
|
UK
|
|
4
|
Randy Mark
|
Ottandy
|
@mdothe
|
user
|
AUS
|
|
5
|
Ram Jacob
|
Thornton
|
@twitter
|
admin
|
IND
|
Hoverable rows
Add .table-hoverto enable a hover state on table rows within a <tbody>.
|
#
|
First Name
|
Last Name
|
Username
|
Role
|
Country
|
|
1
|
Alexander
|
Orton
|
@mdorton
|
Admin
|
USA
|
|
2
|
John Deo
|
Deo
|
@johndeo
|
User
|
USA
|
|
3
|
Randy Orton
|
the Bird
|
@twitter
|
admin
|
UK
|
|
4
|
Randy Mark
|
Ottandy
|
@mdothe
|
user
|
AUS
|
|
5
|
Ram Jacob
|
Thornton
|
@twitter
|
admin
|
IND
|
Table head options
Similar to tables and dark tables,use the modifier classes .thead-lightor .thead-darkto make <thead>s appear light or dark gray.
|
#
|
First Name
|
Last Name
|
Username
|
|
1
|
Mark
|
Otto
|
@mdo
|
|
2
|
Jacob
|
Thornton
|
@fat
|
|
3
|
Larry
|
the Bird
|
@twitter
|
|
#
|
First Name
|
Last Name
|
Username
|
|
1
|
Mark
|
Otto
|
@mdo
|
|
2
|
Jacob
|
Thornton
|
@fat
|
|
3
|
Larry
|
the Bird
|
@twitter
|
Striped rows
Use .table-stripedto add zebra-striping to any table row within the <tbody>.
|
#
|
First Name
|
Last Name
|
Username
|
|
1
|
Mark
|
Otto
|
@mdo
|
|
2
|
Jacob
|
Thornton
|
@fat
|
|
3
|
Larry
|
the Bird
|
@twitter
|
Bordered table
Add .table-borderedfor borders on all sides of the table and cells.
|
#
|
First Name
|
Last Name
|
Username
|
|
1
|
Mark
|
Otto
|
@mdo
|
|
2
|
Mark
|
Otto
|
@TwBootstrap
|
|
3
|
Jacob
|
Thornton
|
@fat
|
|
4
|
Larry the Bird
|
@twitter
|