Individual Border Colors. You might notice in the above tables that those
styles with 3-D effects
(inset, outset, ridge, and
groove) render the shaded borders in black at small border widths. If you like a more
subtle contrast you can color each of the borders separately with individual
border-top, border-right, border-bottom,
and border-left colors. The following tables creates their own 3-D shading
effects with solid borders tinted to resemble inset
and outset styles. The style sheets used for these two tables are shown
Borders around table cells are styled and colored independently from the outer border. In the
following examples the outer border is 1 pixel in width for deemphasis, and cell borders are red and
3 pixels in width.
Individual Border Colors. As in the case with outer borders, cells borders can
be styled and colored independently. Below, all cells in the two tables are styled with
solid borders 5 pixels in width. Different shades of red are applied to their sides to create 3-D
effects resembling inset and outset borders. The
two applicable style sheets are shown below.
You can specify a background color for the table as a whole or selectively apply background
colors to rows, columns, or cells. In the following table a light gray background color is applied to
the entire table by setting the background-color property of the
The following table contains different background colors for each of its rows by specifying a
background-color property for each identified <tr>
tag. The text color of selected rows is set with the color
property. In addition, one particular cell is assigned a background color that overrides the color
of the row it occupies and is given a different border.
In the same fashion as for background colors, you can specify a background image for
a table or any of its rows or cells. In the following example, a textured background is applied to the
entire table with the background-image property applied to the
<table> tag. By default, the pattern is repeated across and down
to fill the table area.
The background color of the table is given by the bgcolor="color"
attribute. When applied to the <table> tag the color fills the
<table border="5" bgcolor="lightblue">
Cell background colors are set by applying the bgcolor attribute to
a <tr> tag (to color the row) or to a
<td> tag (to color the cell). Cell colors override row colors which override table
background colors. The following table specifies a row color with one of its cells taking on a
different background color.