Home > Teaching > Tutorials > HTML Tutorial

Tables

A convenient and easy way to setup pages is using tables. Tables are declared and structured as follows:

<table border="1">
<tbody>
    <tr> <!-- <tr> starts a new row -->
      <td>First column</td> <!-- <td> starts a new column (cell) -->
      <td>Second column</td>
      <td>Third column</td>
    </tr><tr> <!-- start of second row -->
      <td colspan="2" height="75">
         This cell uses the first and second column.</td>
      <td width="100" rowspan="2">
        3rd Column, which also expands down one row.</td>
    </tr><tr>
      <td width="100">First column</td>
      <td>Stuff</td>
      <!-- The third column of this row is consumed by the
        cell in the previous row -->
    </tr>
</tbody>
</table>

Such a table displays like the one below:

Tables are quick and convenient. However, anything not specified, such as cell width and height, may not turn out the way desired. Also note that any conflicting specified column width or row heights may not turn out as desired.