One | Two | |
Three | Four |
At their most basic, tables are made up cells, arranged into rows. You can control display characteristics for the whole table, for individual rows, and for individual cells.
<table border="1px" style="width:300px">
<thead>
<tr>
<th>First Name</th>
<th>Last Name</th>
<th>Age</th>
</tr>
</thead>
<tbody>
<tr>
<td>Jill</td>
<td>Smith</td>
<td>50</td>
</tr>
<tr>
<td>Eve</td>
<td>Jackson</td>
<td>94</td>
</tr>
<tr>
<td>John</td>
<td>Doe</td>
<td>80</td>
</tr>
</tbody>
</table>
A table cell in HTML is a non-empty element and should always be closed. There are two different kinds of table cell in HTML: normal table cell and header cell. <td> denotes a table cell, the name implying 'data', while <th> denotes a table 'header'. The two can be used interchangeably, but it is recommended that header cell be only used for the top and side headers of a table.
A table cell also must be nested within a <table> tag and a <tr> (table row) tag. If there are more table cell tags in any given row than in any other, the particular <tr> must be given a colspan attribute declaring how many columns of cells wide it should be.
An example of an HTML table containing 4 cells:
Cell 1 | Cell 2 |
Cell 3 | Cell 4 |
(2) Data Type
A data type must be specified for each column & for each attributes compromising on abstract data type. They are classifieed broadly as pre-defined data type.
<!DOCTYPE html><html><body><table border="1" cellspacing="0"><tr><th rowspan="2"> One</th><th colspan="2">Two</th></tr><tr><td>Three</td><td>Four</td></tr></table></body></html>
output:-
One | Two | |
---|---|---|
Three | Four |