HTMLisEasy.com
HTML tutorials for the rest of us...

Let's get rid of cellpadding and cellspacing and go back to our simple little table.

<table border="3">

<tr>
<td>Ed</td>
<td>Tom</td>
<td>Rick</td>
</tr>

<tr>
<td>Larry</td>
<td>Curly</td>
<td>Moe</td>
</tr>

</table>
Ed Tom Rick
Larry Curly Moe

It's often very useful to be able to specify background colors for a table cell, row or the whole table. You use bgcolor just like you would in the <body> tag.

<table border="3" bgcolor="#ff9933">

<tr>
<td>Ed</td>
<td>Tom</td>
<td>Rick</td>
</tr>

<tr>
<td>Larry</td>
<td>Curly</td>
<td>Moe</td>
</tr>

</table>
Ed Tom Rick
Larry Curly Moe

<table border="3">

<tr bgcolor="#ff6666">
<td>Ed</td>
<td>Tom</td>
<td>Rick</td>
</tr>

<tr bgcolor="#66cccc">
<td>Larry</td>
<td>Curly</td>
<td>Moe</td>
</tr>

</table>
Ed Tom Rick
Larry Curly Moe

<table border="3">

<tr bgcolor="#dd44dd">
<td>Ed</td>
<td>Tom</td>
<td>Rick</td>
</tr>

<tr>
<td bgcolor="#ff0000">Larry</td>
<td>Curly</td>
<td bgcolor="#3366ff">Moe</td>
</tr>

</table>
Ed Tom Rick
Larry Curly Moe

Here are a couple handy charts I use to help choose background colors... one with 216 colors and another with 1536 colors. You can also use ColorPicker for playing around with colors.

One more thing about these table background colors... a <td> bgcolor will override a <tr> bgcolor and a <tr> bgcolor will override a <table> bgcolor. Not that this needs further explanation but I'm kind of having fun with this so here's an example:

<table border="3" bgcolor="#ff9933">

<tr bgcolor="#00bb00">
<td bgcolor="#9999ff">Ed</td>
<td>Tom</td>
<td>Rick</td>
</tr>

<tr>
<td>Larry</td>
<td>Curly</td>
<td>Moe</td>
</tr>

</table>
Ed Tom Rick
Larry Curly Moe

FAQ: Can I use an image as a table background?

A: Yes, learn about it here

<< BACK NEXT >>
Table Tutor
Lessons: Intro 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17
Tables Quick Reference
HTML 4.0 Reference      Barebones HTML Guide