Path = Home : Webmaster Resources : HTML Design Tips : How To Add Image Backgrounds To Tables

How To Add Image Backgrounds To Tables

 

You can add an image background to a table by adding background="image.gif" - where image.gif is the name of the image that you want to use.

One background image for all the table

<table width="460" border="1" cellpadding="5" cellspacing="0" background="image.gif">
<tr>
<td>Column 1 </td>
</tr>
</table>

Column 1

 

The same image in each column

<table width="460" border="1" cellpadding="5" cellspacing="0" background="image.gif">
<tr>
<td>Column 1</td>
<td>Column 2</td>
</tr>
</table>

Column 1

Column 2

 

A different image in each column

<table width="460" border="1" cellspacing="0" cellpadding="5">
<tr>
<td background="image1.gif">Column 1 </td>
<td background="image2.gif">Column 2 </td>
</tr>
</table>

Column 1

Column 2

 

Different images in each column and row

<table width="460" border="1" cellspacing="0" cellpadding="5">
<tr>
<td background="image1.gif">Column 1 Row 1 </td>
<td background="image2.gif">Column 2 Row 1 </td>
</tr>
<tr>
<td background="image3.gif">Column 1 Row 2 </td>
<td background="image4.gif">Column 2 Row 2 </td>
</tr>
</table>

Column 1 Row 1	Column 2 Row 1
Column 1 Row 2	Column 2 Row 2