Table Image Backgrounds

In the previous lesson we learned how to spice up a table with colors. Now we'll go a bit farther and put images in the background. These images use the background attribute. Here's a table with the WengerEnterprises logo in it:

Here's the code:

<table border="1" background="http://wengerenterprises.com/images/weirdologoub5.gif">
<tr>
<td>Cell 1
</td>
<td>Cell 2
</td>
</tr>
<tr>
<td>Cell 3
</td>
<td>Cell 4
</td>
</tr>
</table>

Now, if you remember the previous lesson, we can apply borders and background colors to each individual cell. The same is true about the background image. All we need to do is add the background attribute into the td tag instead of the table tag.

<table border="1">
<tr>
<td background="http://wengerenterprises.com/images/weirdologoub5.gif">Cell 1
</td>
<td>Cell 2
</td>
</tr>
<tr>
<td>Cell 3
</td>
<td>Cell 4
</td>
</tr>
</table>

That's all you've got to do to put an image in your table's background. The next lesson will cover spanning rows and columns and spacing. They are two important subjects, but they can sometimes be hard to remember.