Styled Table

Tabular data with style

Column 1 Column 2 Column 3 Column 4
Item #1 Description Subtotal: $1.00
Item #2 Description Discount: $2.00
Item #3 Description Shipping: $3.00
Item #4 Description Tax: $4.00
All Items Description Your Total: $10.00
*Your table footer...

Get The Code

[table color="#444"]
<table class="custom-table" summary="Sample Table">
<thead>
<tr>
<th scope="col">Column 1</th>
<th scope="col">Column 2</th>
<th scope="col">Column 3</th>
<th scope="col">Column 4</th>
</tr>
</thead>
<tbody>
<tr>
<td>Item #1</td>
<td>Description</td>
<td>Subtotal:</td>
<td>$1.00</td>
</tr>
<tr>
<td>Item #2</td>
<td>Description</td>
<td>Discount:</td>
<td>$2.00</td>
</tr>
<tr>
<td>Item #3</td>
<td>Description</td>
<td>Shipping:</td>
<td>$3.00</td>
</tr>
<tr>
<td>Item #4</td>
<td>Description</td>
<td>Tax:</td>
<td>$4.00</td>
</tr>
<tr>
<td><strong>All Items</strong></td>
<td><strong>Description</strong></td>
<td><strong>Your Total:</strong></td>
<td><strong>$10.00</strong></td>
</tr>
</tbody>
<tfoot>
<tr>
<td colspan="4">*Your table footer...</td>
</tr>
</tfoot>
</table>
[/table]

Customization Options

  • color – the background color of the table header