1. Home
  2. Tables
  3. Normal Tables

Table > Normal Tables

  • My Income $47,171
  • Site Traffic  45%
  • Site Orders  2447

Normal Table

Adds borders to any table row within <table> by adding the .table-bordered with the base class

Column name Column name Column name Column name
Row 1 Row 2 Row 3 Row 4
Row 1 Row 2 Row 3 Row 4
Row 1 Row 2 Row 3 Row 4
Row 1 Row 2 Row 3 Row 4
Row 1 Row 2 Row 3 Row 4
Row 1 Row 2 Row 3 Row 4

No Padding

Adds zebra-striping to table row within <table> by adding the .table-striped with the base class
Column name Column name Column name Column name
Row 1 Row 2 Row 3 Row 4
Row 1 Row 2 Row 3 Row 4
Row 1 Row 2 Row 3 Row 4
Row 1 Row 2 Row 3 Row 4
Row 1 Row 2 Row 3 Row 4
Row 1 Row 2 Row 3 Row 4

Table hover states

Enables hover effect <table> by adding the .table-hover with the base class
# First Name Last Name Username
1 Mark Otto @mdo
2 Jacob Thornton @fat
3 Larry the Bird @twitter
4 Wise Man @myorange

Table TR with colors

Add custom colors to your TR and TD <tr> by adding .success, .danger, .warning and .info respectively
# Product Payment Taken Status
1 TB - Monthly 01/04/2012 Approved
2 TB - Monthly 02/04/2012 Declined
3 TB - Monthly 03/04/2012 Pending
4 TB - Monthly 04/04/2012 Call in to confirm

Condenced table + combined prev. classes

A combined table effect with all classes mentioned above added to <table>. .table-bordered .table-striped .table-condensed .table-hover .smart-form .has-tickbox
Column name Column name Column name Column name
Row 1 Row 2 Row 3 Row 4
Row 1 Row 2 Row 3 Row 4
Row 1 Row 2 Row 3 Row 4
Row 1 Row 2 Row 3 Row 4
Row 1 Row 2 Row 3 Row 4
Row 1 Row 2 Row 3 Row 4