Table

For the displaying of data in tabular form you can use tables.

For the integration of tables with framework tables add the class .table For example:

Number	First Name	Last Name
01	Leonard	Cohen
02	Bob	Marley
03	Jhon	Lenon
04	Leonard	Cohen

HTML Example

<table class="table hover-bg"> 
   <thead>
      <tr>
         <td>...</td>
         <td>...</td>
         <td>...</td>
      </tr>
   </thead>
   <tbody>
      <tr>
         <td>...</td>
         <td>...</td>
         <td>...</td>
      </tr>
   </tbody>
</table>

Extra Styles

With extra styles you can alter the size, color, rounded corners and borders.

You can alter the radius of corners and size of tables. For to add the rounded corners you can add .bradius-x class to table tag. The classes rounded corners has 5 size from 1 - 5. These classes used for all elements.
For to alter the size of tables add the classes .micro ,.small, .medium, .large or .xlarge to the table tag.
For the using alternating colors tables add the classes .zebra
If you want tables without inside borders add the class .un-border
For example:

Name	Surname
Leonard	Cohen
Bob	Marley

HTML Example

<table class="table large"> 
   <tbody>
      <tr>
         <td>...</td>
         <td>...</td>
         <td>...</td>
      </tr>
   </tbody>
</table>

Number	Name	Surename
01	Leonard	Cohen
02	Bob	Marley
03	Jhon	Lenon
01	Leonard	Cohen
02	Bob	Marley

HTML Example

<table class="table zebra un-border"> 
   <tbody>
      <tr>
         <td>...</td>
         <td>...</td>
         <td>...</td>
      </tr>
   </tbody>
</table>