By default browsers center heading cells (th), and left align data cells (td).
You can change alignment using the align attribute, which can be added to each cell or to the row (tr element).
It is used with the values "left", "center" or "right":
HTML Code :
<table border="1" cellpadding="10" width="80%">
<tr align="center"><td> Table</td></tr>
</table>
| Table |
HTML Code :
<table border="1" cellpadding="10" width="80%">
<tr align="center"><th>Year</th><th>Sales</th></tr>
<tr align="center"><td>2000</td><td>$18M</td></tr>
<tr align="center"><td>2001</td><td>$25M</td></tr>
<tr align="center"><td>2002</td><td>$36M</td></tr>
</table>
| Year | Sales |
|---|---|
| 2000 | $18M |
| 2001 | $25M |
| 2002 | $36M |
Coloring your tables
This page uses a style sheet to set the background colors for tables, with a different color for heading and data cells. The style rules I used are as follows
HTML Code :
<table border="0" cellspacing="0" cellpadding="10">
<tr>
<th bgcolor="#CCCC99">Year</th>
<th bgcolor="#CCCC99">Sales</th>
</tr>
<tr>
<td bgcolor="#FFFF66">2000</td>
<td bgcolor="#FFFF66">$18M</td>
</tr>
<tr>
<td bgcolor="#FFFF66">2001</td>
<td bgcolor="#FFFF66">$25M</td>
</tr>
<tr>
<td bgcolor="#FFFF66">2002</td>
<td bgcolor="#FFFF66">$36M</td>
</tr>
</table>
| Year | Sales |
|---|---|
| 2000 | $18M |
| 2001 | $25M |
| 2002 | $36M |
