If you like to change the background color for the entire table, just use the bgcolor property in the <table> tag. You can also change the color for the entire row (by inserting bgcolor inside the <tr> tag) or for an individual cell (by inserting bgcolor inside the <td> tag). To specify a color for the bgcolor property, you can either use a RGB value (such as #22DD55, #22DDAA, etc.) or color name (such as “white”, “yellow”, etc.). Listing 1 shows some examples:

Listing 1 – Examples of different table background colors with corresponding HTML code
Example HTML code
0 0
0 0

bgcolor inserted inside the <table> tag. This sets a background color for the entire table.

<table width="20" border="1" cellspacing="0" cellpadding="0" bgcolor="#99CCCC">
<tr>
<td>0</td>
<td>0</td>
</tr>
<tr>
<td>0</td>
<td>0</td>
</tr>
</table>
1 1
1 1

bgcolor inserted inside each <tr> tag. This sets a background color for each row.

<table width="20" border="1" cellspacing="0" cellpadding="">
<tr bgcolor="#FFCCCC">
<td>1</td>
<td>1</td>
</tr>
<tr bgcolor="#66CCFF">
<td>1</td>
<td>1</td>
</tr>
</table>
5 5
5 5

bgcolor inserted inside each <td> tag. This sets a background color for each table cell.

<table width="20" border="1" cellspacing="0" cellpadding="0">
<tr>
<td bgcolor="#FF99FF">0</td>
<td bgcolor="#FFCC99">0</td>
</tr>
<tr>
<td bgcolor="#FFFF33">0</td>
<td bgcolor="#663399">0</td>
</tr>
</table>

Suppose you specify “red” as the background color for the entire table (HTML code : <table bg=”red”>) and for one particular cell you set the background color to “green” (HTML code : <td bg=”green”>)? Will the browser use the background color red or green for that particular cell? It will be green because the tag most closest to the content takes precedence (in this case it’s the <td> tag). All that means is that for the same table you can conveniently:

  1. Set the background color for the entire table. Assume we set it to as red : table (<table bg=”red”>).
  2. Override the table color red at any desired row by <tr bg=”green”>). This will set the background color as green for the entire row.
  3. Override background colors for both the <table> tag and the <tr> tag. For example, <td bg=”blue”> will set the background color for one cell as blue regardless of what, if any, background color is specified in the <table> tag and the <tr> tag.