Invoice Table
Without colgroup
and Without rowgroup
Invoice Table 1
Product ID
Product
Description
Quantity
Unit Price
Total
Key
Item
Description
2 times
25.99 $
51.98
Key
Item
Description
2 times
25.99 $
51.98
Key
Item
Description
2 times
25.99 $
51.98
Key
Item
Description
2 times
25.99 $
51.98
Key
Item
Description
2 times
25.99 $
51.98
Key
Item
Description
2 times
25.99 $
51.98
Key
Item
Description
2 times
25.99 $
51.98
Key
Item
Description
2 times
25.99 $
51.98
Key
Item
Description
2 times
25.99 $
51.98
Key
Item
Description
2 times
25.99 $
51.98
Subtotal
519.80
Taxes (10%)
51.98
Total
571.78
Source Code of Invoice Table 1
<table class="wet-boew-zebra">
<caption>Invoice Table 1</caption>
<tr>
<th>Product ID</th>
<th>Product</th>
<th>Description</th>
<th>Quantity</th>
<th>Unit Price</th>
<th>Total</th>
</tr>
<tr>
<td>Key</td>
<th>Item</th>
<td>Description</td>
<td>2 times</td>
<td>25.99 $</td>
<td>51.98</td>
</tr>
<tr>
<td>Key</td>
<th>Item</th>
<td>Description</td>
<td>2 times</td>
<td>25.99 $</td>
<td>51.98</td>
</tr>
<tr>
<td>Key</td>
<th>Item</th>
<td>Description</td>
<td>2 times</td>
<td>25.99 $</td>
<td>51.98</td>
</tr>
<tr>
<td>Key</td>
<th>Item</th>
<td>Description</td>
<td>2 times</td>
<td>25.99 $</td>
<td>51.98</td>
</tr>
<tr>
<td>Key</td>
<th>Item</th>
<td>Description</td>
<td>2 times</td>
<td>25.99 $</td>
<td>51.98</td>
</tr>
<tr>
<td>Key</td>
<th>Item</th>
<td>Description</td>
<td>2 times</td>
<td>25.99 $</td>
<td>51.98</td>
</tr>
<tr>
<td>Key</td>
<th>Item</th>
<td>Description</td>
<td>2 times</td>
<td>25.99 $</td>
<td>51.98</td>
</tr>
<tr>
<td>Key</td>
<th>Item</th>
<td>Description</td>
<td>2 times</td>
<td>25.99 $</td>
<td>51.98</td>
</tr>
<tr>
<td>Key</td>
<th>Item</th>
<td>Description</td>
<td>2 times</td>
<td>25.99 $</td>
<td>51.98</td>
</tr>
<tr>
<td>Key</td>
<th>Item</th>
<td>Description</td>
<td>2 times</td>
<td>25.99 $</td>
<td>51.98</td>
</tr>
<tr>
<th colspan="5">Subtotal</th>
<td>519.80</td>
</tr>
<tr>
<th colspan="5">Taxes (10%)</th>
<td>51.98</td>
</tr>
<tr>
<th colspan="5">Total</th>
<td>571.78</td>
</tr>
</table>
With colgroup
and rowgroup
Invoice Table 2
Product ID
Product
Description
Quantity
Unit Price
Total
Key
Item
Description
2 times
25.99 $
51.98
Key
Item
Description
2 times
25.99 $
51.98
Key
Item
Description
2 times
25.99 $
51.98
Key
Item
Description
2 times
25.99 $
51.98
Key
Item
Description
2 times
25.99 $
51.98
Key
Item
Description
2 times
25.99 $
51.98
Key
Item
Description
2 times
25.99 $
51.98
Key
Item
Description
2 times
25.99 $
51.98
Key
Item
Description
2 times
25.99 $
51.98
Key
Item
Description
2 times
25.99 $
51.98
Subtotal
519.80
Taxes (10%)
51.98
Total
571.78
Source Code of Invoice Table 2
<table class="wet-boew-zebra">
<caption>Invoice Table 2</caption>
<colgroup>
<col />
<col />
<col />
</colgroup>
<colgroup>
<col />
<col />
</colgroup>
<colgroup>
<col />
</colgroup>
<thead>
<tr>
<th>Product ID</th>
<th>Product</th>
<th>Description</th>
<th>Quantity</th>
<th>Unit Price</th>
<th>Total</th>
</tr>
</thead>
<tbody>
<tr>
<td>Key</td>
<th>Item</th>
<td>Description</td>
<td>2 times</td>
<td>25.99 $</td>
<td>51.98</td>
</tr>
<tr>
<td>Key</td>
<th>Item</th>
<td>Description</td>
<td>2 times</td>
<td>25.99 $</td>
<td>51.98</td>
</tr>
<tr>
<td>Key</td>
<th>Item</th>
<td>Description</td>
<td>2 times</td>
<td>25.99 $</td>
<td>51.98</td>
</tr>
<tr>
<td>Key</td>
<th>Item</th>
<td>Description</td>
<td>2 times</td>
<td>25.99 $</td>
<td>51.98</td>
</tr>
<tr>
<td>Key</td>
<th>Item</th>
<td>Description</td>
<td>2 times</td>
<td>25.99 $</td>
<td>51.98</td>
</tr>
<tr>
<td>Key</td>
<th>Item</th>
<td>Description</td>
<td>2 times</td>
<td>25.99 $</td>
<td>51.98</td>
</tr>
<tr>
<td>Key</td>
<th>Item</th>
<td>Description</td>
<td>2 times</td>
<td>25.99 $</td>
<td>51.98</td>
</tr>
<tr>
<td>Key</td>
<th>Item</th>
<td>Description</td>
<td>2 times</td>
<td>25.99 $</td>
<td>51.98</td>
</tr>
<tr>
<td>Key</td>
<th>Item</th>
<td>Description</td>
<td>2 times</td>
<td>25.99 $</td>
<td>51.98</td>
</tr>
<tr>
<td>Key</td>
<th>Item</th>
<td>Description</td>
<td>2 times</td>
<td>25.99 $</td>
<td>51.98</td>
</tr>
</tbody>
<tbody>
<tr>
<th colspan="5">Subtotal</th>
<td>519.80</td>
</tr>
<tr>
<th colspan="5">Taxes (10%)</th>
<td>51.98</td>
</tr>
</tbody>
<tbody>
<tr>
<th colspan="5">Total</th>
<td>571.78</td>
</tr>
</tbody>
</table>
With colgroup
and rowgroup
and the class hassum
Please note: Using of the class hassum
This have an impact on relationships between the consecutive data group in the same data level. Subsequent groups would be know as summary group . Third and subsequent groups get their data level decreased .
Invoice Table 3
Product ID
Product
Description
Quantity
Unit Price
Total
Key
Item
Description
2 times
25.99 $
51.98
Key
Item
Description
2 times
25.99 $
51.98
Key
Item
Description
2 times
25.99 $
51.98
Key
Item
Description
2 times
25.99 $
51.98
Key
Item
Description
2 times
25.99 $
51.98
Key
Item
Description
2 times
25.99 $
51.98
Key
Item
Description
2 times
25.99 $
51.98
Key
Item
Description
2 times
25.99 $
51.98
Key
Item
Description
2 times
25.99 $
51.98
Key
Item
Description
2 times
25.99 $
51.98
Subtotal
519.80
Taxes (10%)
51.98
Total
571.78
Source Code of Invoice Table 3
<table class="wet-boew-zebra hassum">
<caption>Invoice Table 3</caption>
<colgroup>
<col />
<col />
<col />
</colgroup>
<colgroup>
<col />
<col />
</colgroup>
<colgroup>
<col />
</colgroup>
<thead>
<tr>
<th>Product ID</th>
<th>Product</th>
<th>Description</th>
<th>Quantity</th>
<th>Unit Price</th>
<th>Total</th>
</tr>
</thead>
<tbody>
<tr>
<td>Key</td>
<th>Item</th>
<td>Description</td>
<td>2 times</td>
<td>25.99 $</td>
<td>51.98</td>
</tr>
<tr>
<td>Key</td>
<th>Item</th>
<td>Description</td>
<td>2 times</td>
<td>25.99 $</td>
<td>51.98</td>
</tr>
<tr>
<td>Key</td>
<th>Item</th>
<td>Description</td>
<td>2 times</td>
<td>25.99 $</td>
<td>51.98</td>
</tr>
<tr>
<td>Key</td>
<th>Item</th>
<td>Description</td>
<td>2 times</td>
<td>25.99 $</td>
<td>51.98</td>
</tr>
<tr>
<td>Key</td>
<th>Item</th>
<td>Description</td>
<td>2 times</td>
<td>25.99 $</td>
<td>51.98</td>
</tr>
<tr>
<td>Key</td>
<th>Item</th>
<td>Description</td>
<td>2 times</td>
<td>25.99 $</td>
<td>51.98</td>
</tr>
<tr>
<td>Key</td>
<th>Item</th>
<td>Description</td>
<td>2 times</td>
<td>25.99 $</td>
<td>51.98</td>
</tr>
<tr>
<td>Key</td>
<th>Item</th>
<td>Description</td>
<td>2 times</td>
<td>25.99 $</td>
<td>51.98</td>
</tr>
<tr>
<td>Key</td>
<th>Item</th>
<td>Description</td>
<td>2 times</td>
<td>25.99 $</td>
<td>51.98</td>
</tr>
<tr>
<td>Key</td>
<th>Item</th>
<td>Description</td>
<td>2 times</td>
<td>25.99 $</td>
<td>51.98</td>
</tr>
</tbody>
<tbody>
<tr>
<th colspan="5">Subtotal</th>
<td>519.80</td>
</tr>
<tr>
<th colspan="5">Taxes (10%)</th>
<td>51.98</td>
</tr>
</tbody>
<tbody>
<tr>
<th colspan="5">Total</th>
<td>571.78</td>
</tr>
</tbody>
</table>
With colgroup
, rowgroup
and last row group is tfoot
Invoice Table 4
Product ID
Product
Description
Quantity
Unit Price
Total
Key
Item
Description
2 times
25.99 $
51.98
Key
Item
Description
2 times
25.99 $
51.98
Key
Item
Description
2 times
25.99 $
51.98
Key
Item
Description
2 times
25.99 $
51.98
Key
Item
Description
2 times
25.99 $
51.98
Key
Item
Description
2 times
25.99 $
51.98
Key
Item
Description
2 times
25.99 $
51.98
Key
Item
Description
2 times
25.99 $
51.98
Key
Item
Description
2 times
25.99 $
51.98
Key
Item
Description
2 times
25.99 $
51.98
Subtotal
519.80
Taxes (10%)
51.98
Total
571.78
Source Code of Invoice Table 4
<table class="wet-boew-zebra">
<caption>Invoice Table 4</caption>
<colgroup>
<col />
<col />
<col />
</colgroup>
<colgroup>
<col />
<col />
</colgroup>
<colgroup>
<col />
</colgroup>
<thead>
<tr>
<th>Product ID</th>
<th>Product</th>
<th>Description</th>
<th>Quantity</th>
<th>Unit Price</th>
<th>Total</th>
</tr>
</thead>
<tbody>
<tr>
<td>Key</td>
<th>Item</th>
<td>Description</td>
<td>2 times</td>
<td>25.99 $</td>
<td>51.98</td>
</tr>
<tr>
<td>Key</td>
<th>Item</th>
<td>Description</td>
<td>2 times</td>
<td>25.99 $</td>
<td>51.98</td>
</tr>
<tr>
<td>Key</td>
<th>Item</th>
<td>Description</td>
<td>2 times</td>
<td>25.99 $</td>
<td>51.98</td>
</tr>
<tr>
<td>Key</td>
<th>Item</th>
<td>Description</td>
<td>2 times</td>
<td>25.99 $</td>
<td>51.98</td>
</tr>
<tr>
<td>Key</td>
<th>Item</th>
<td>Description</td>
<td>2 times</td>
<td>25.99 $</td>
<td>51.98</td>
</tr>
<tr>
<td>Key</td>
<th>Item</th>
<td>Description</td>
<td>2 times</td>
<td>25.99 $</td>
<td>51.98</td>
</tr>
<tr>
<td>Key</td>
<th>Item</th>
<td>Description</td>
<td>2 times</td>
<td>25.99 $</td>
<td>51.98</td>
</tr>
<tr>
<td>Key</td>
<th>Item</th>
<td>Description</td>
<td>2 times</td>
<td>25.99 $</td>
<td>51.98</td>
</tr>
<tr>
<td>Key</td>
<th>Item</th>
<td>Description</td>
<td>2 times</td>
<td>25.99 $</td>
<td>51.98</td>
</tr>
<tr>
<td>Key</td>
<th>Item</th>
<td>Description</td>
<td>2 times</td>
<td>25.99 $</td>
<td>51.98</td>
</tr>
</tbody>
<tbody>
<tr>
<th colspan="5">Subtotal</th>
<td>519.80</td>
</tr>
<tr>
<th colspan="5">Taxes (10%)</th>
<td>51.98</td>
</tr>
</tbody>
<tfoot>
<tr>
<th colspan="5">Total</th>
<td>571.78</td>
</tr>
</tfoot>
</table>
Date modified: 2013-04-11