Complex HTML Table

Complex HTMl table:



<!doctype html>
<html>

<head>
<title>My first table</title>
<style>
#t5,
#t5 th,
#t5 td {
border: 2px solid black;
border-collapse: collapse;
padding: 5px;
text-align: left;
}
#t5 th{
background-color: rgb(224, 216, 216);
}
</style>
</head>


<body>

<table id="t5">
<caption>A complex table</caption>
<tr>
<th colspan="3">Invoice #123456789</th>
<th>14 January 2025</th>
</tr>
<tr>
<td colspan="2"><strong>Pay to:</strong><br>Acme Billing Co. <br> 123 Main St. <br> Cityville, NA 12345</td>
<td colspan="2"><strong>Customer:</strong><br>John Smith <br> 321 Willow Way <br>Southest Northwestershire,
MA 54321</td>
</tr>
<tr>
<th style="width: 25%;">Name/Description</th>
<th style="width: 25%;">Qty.</th>
<th style="width: 25%;">@</th>
<th style="width: 25%;">Cost</th>
</tr>
<tr>
<td>Paperclips</td>
<td>1000</td>
<td>0.01</td>
<td>10.00</td>
</tr>
<tr>
<td>Staples</td>
<td>100</td>
<td>1</td>
<td>100.00</td>
</tr>
<tr>
<th colspan="3">Subtotal</th>
<td>110</td>
</tr>
<tr>
<th colspan="2">Tax</th>
<td>8%</td>
<td>8.80</td>
</tr>
<tr>
<th colspan="3">Grand Total</th>
<td>$ 118.80</td>
</tr>
</table>


</body>

</html>

Comments