1. Home
  2. Computing & Technology
  3. Web Design / HTML

How do you change the background color of a table?

By , About.com Guide

Question: How do you change the background color of a table?
Answer:

The attribute bgcolor will change the background color of the table, the current table row, or the current table cell. But the bgcolor attribute is deprecated in favor of style sheets. The better way to change the background color is to add the style property background-color to the table, row, or cell tag.

<table style="background-color: #ff0000;">
<tr style="background-color: yellow;">
<td style="background-color: #000;">

Or you can set the styles in a style sheet in the head of your document or an external style sheet.

table { background-color: #ff0000; }
tr { background-color: yellow; }
td { background-color: #000; }

The best way to set the background color on a column is to create a style class and then assign that class to the cells in that column.

The CSS:

td.blueCol { background-color: blue; }

The HTML:

<table>
<tr><td class="blueCol">cell 1</td><td>cell 2</td></tr>
<tr><td class="blueCol">cell 1</td><td>cell 2</td></tr>
</table>

HTML Tables FAQ

Explore Web Design / HTML
About.com Special Features

Holiday Central

What to eat, where to go, fun things to do and how to save money on the perfect gifts. More >

Family Tech Center

Stay connected and entertained with reviews on tips on the latest HDTVs, cellphones and more. More >

  1. Home
  2. Computing & Technology
  3. Web Design / HTML
  4. HTML and XHTML
  5. XHTML
  6. Tables
  7. How do you change the background color of a table?>

©2009 About.com, a part of The New York Times Company.

All rights reserved.