<table> and </table>

PURPOSE: To make a table on the page. For a borderless table make the border equal 0. The table width can be declared in percentages or pixels. The summary attribute does not display on the page it is just for your use to give yourself a description of what is in the table.

Below is a basic html document. The referenced html tag is in RED. All tags must have a start and a end tag. Most end tags have a / before the tags name, however there are a few that are done differently. The tags that end differently will be noted and highlighted. The order of the start and end tags is also very important to proper display of your page in a web browser.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title> The Page Title Goes Here </title>
</head>
<body>
<table border="1" width="100%" cellspacing="0" cellpadding="0" summary="test table">
<tr>
<td> First </td>
<td> Second </td>
</tr>
<tr>
<td> Third </td>
<td> Fourth </td>
</tr>
</table>
</body>
</html>

The above code produces the following table with a border:

First CellSecond Cell
Third CellFourth Cell

Here are examples of using the cellspacing and cellpadding attributes:

<table border="1" width="300" cellspacing="10" cellpadding="0" summary="test table">
<tr>
<td>Data Item 1</td>
<td ROWSPAN="2">Data Item 2</td>
<td>Data Item 3</td>
</tr>
<tr>
<td>Data Item 4</td><td>Data Item 5</td>
</tr>
</table>

Data Item 1 Data Item 2 Data Item 3
Data Item 4Data Item 5

<table border="1" width="300" cellspacing="0" cellpadding="10" summary="test table">
<tr>
<td>Data Item 1</td>
<td ROWSPAN="2">Data Item 2</td>
<td>Data Item 3</td>
</tr>
<tr>
<td>Data Item 4</td><td>Data Item 5</td>
</tr>
</table>

Data Item 1 Data Item 2 Data Item 3
Data Item 4Data Item 5

MORE Table Examples Using Rowspan and Colspan Attributes:

Here is a example of using the rowspan attribute. It spans over two rows.

<table border="1" width="300" cellspacing="0" cellpadding="0" summary="test table">
<tr>
<td>Data Item 1</td>
<td ROWSPAN="2">Data Item 2</td>
<td>Data Item 3</td>
</tr>
<tr>
<td>Data Item 4</td><td>Data Item 5</td>
</tr>
</table>

Data Item 1 Data Item 2 Data Item 3
Data Item 4Data Item 5

Here is a example of using the colspan attribute. It spans over two columns.

<table border="1" width="300" cellspacing="0" cellpadding="0" summary="test table">
<tr>
<td>Data Item 1</td>
<td COLSPAN="2">Data Item 2</td>
</tr>
<tr>
<td>Data Item 3</td> <td>Data Item 4</td> <td>Data Item 5</td>
</tr>
</table>

Data Item 1 Data Item 2
Data Item 3 Data Item 4 Data Item 5

© Copyright 2001,2002 Southern Twilight    All rights reserved.

Back To HTML Examples