Basic Tables header small text goes here...

Default Table

# Username Email Address
1 Nicky Almera nicky@hotmail.com
2 Edmund Wong edmund@yahoo.com
3 Harvinder Singh harvinder@gmail.com
<table class="table">
  ...
</table>

Hover Table

# Username Email Address
1 Nicky Almera nicky@hotmail.com
2 Edmund Wong edmund@yahoo.com
3 Harvinder Singh harvinder@gmail.com
<table class="table table-hover">
  ...
</table>

Condensed Table

# Username Email Address
1 Nicky Almera nicky@hotmail.com
2 Edmund Wong edmund@yahoo.com
3 Harvinder Singh harvinder@gmail.com
<table class="table table-condensed">
  ...
</table>

Responsive Table

# Table heading Table heading Table heading Table heading Table heading Table heading
1 Table cell Table cell Table cell Table cell Table cell Table cell
2 Table cell Table cell Table cell Table cell Table cell Table cell
3 Table cell Table cell Table cell Table cell Table cell Table cell
<div class="table-responsive">
  <table class="table">
    ...
  </table>
</div>

Table Striped

# Username Email Address
1 Nicky Almera nicky@hotmail.com
2 Edmund Wong edmund@yahoo.com
3 Harvinder Singh harvinder@gmail.com
<table class="table table-striped">
  ...
</table>

Bordered Table

# Username Email Address
1 Nicky Almera nicky@hotmail.com
2 Edmund Wong edmund@yahoo.com
3 Harvinder Singh harvinder@gmail.com
<table class="table table-bordered">
  ...
</table>

UI Elements in Table NEW

# Username Email Address
Nicky Almera nicky@hotmail.com Edit Delete
Edmund Wong edmund@yahoo.com
Harvinder Singh harvinder@gmail.com Edit Delete
<table class="table">
  <tbody>
    <tr>
      <!-- with image -->
      <td class="with-img">...</td>

      <!-- with button -->
      <td class="with-btn">...</td>

      <!-- with button group -->
      <td class="with-btn-group">...</td>
    </tr>
  </tbody>
</table>

Form Elements in Table NEW

Username Email Address
Nicky Almera nicky@hotmail.com
Edmund Wong edmund@yahoo.com
harvinder@gmail.com
@
terry@gmail.com
<table class="table">
  <tbody>
    <tr>
      <!-- with checkbox -->
      <td class="with-checkbox">...</td>

      <!-- with radio -->
      <td class="with-radio">...</td>

      <!-- with form input -->
      <td class="with-form-control">...</td>

      <!-- with input group -->
      <td class="with-input-control">...</td>
    </tr>
  </tbody>
</table>

Table Row Classes

# Username Email Address
1 Nicky Almera nicky@hotmail.com
2 Terry Khoo terry@gmail.com
3 Edmund Wong edmund@yahoo.com
4 Harvinder Singh harvinder@gmail.com
5 Terry Khoo terry@gmail.com
<table class="table">
  <tbody>
    <tr class="active">...</tr>
    <tr class="info">...</tr>
    <tr class="success">...</tr>
    <tr class="warning">...</tr>
    <tr class="danger">...</tr>
  </tbody>
</table>
Color Theme
Header Styling
Header
Sidebar Styling
Sidebar
Sidebar Gradient
Direction
THEME VERSION