Table Attributes

The table attributes which affect the tables appearance include:

• border="x"
• width="x" or width="x%"
• cellpadding="x"
• cellspacing="x"
• bgcolor="#xxxxxx" (hex code)

where "x" is equal to a value in pixels. You can also use a percentage for the value of the 'width'. Refer to the lecture for explanations of the terms. The attributes are added to the <table> tag in the normal manner.

An example of these attributes might look like this:

Data A	Data B
Data C	Data D

This is what the code looks like:

<table border="5" width="50%" cellspacing="15" cellpadding="10" bgcolor="#6EC6F1">
<tr>
<td>Data A</td>
<td>Data B</td>
</tr>
<tr>
<td>Data C</td>
<td>Data D</td>
</tr>
</table>


You can copy this code into your HTML document and change the values to see different effects.

Lets take a look at the difference between cellspacing and cellpadding attributes.

Cellspacing creates space BETWEEN each data cell.

Cellpadding creates space AROUND the content and the data cell border.

Larger numbers produce more dramatic results, smaller numbers are more subtle. Experiment with this to produce different effects.