HTML Table Border Colors

In this section we'll look at setting the colors of table borders. First we'll look at setting the borders to a single color. In the next page we'll look at setting the light and dark shades of the border.

The color of the table borders as a whole is set with the BORDERCOLOR attribute of the <TABLE ...> tag. For example, this code sets the border to red:

This Code Makes This
<TABLE border="1" bordercolor="#CBD3E1" bgcolor="#F1F4F5" BORDERCOLOR=RED>
<TR> <TD>carrots</TD> <TD>garlic</TD> </TR>
<TR> <TD>celery</TD> <TD>onions</TD> </TR>
</TABLE>
carrotsgarlic
celeryonions

Netscape and MSIE have very different ways of rendering BORDERCOLOR. Netscape maintains the 3-D appearance. MSIE renders all borders as the same color, making the border appear flat. MSIE also sets the color of the inner borders.

BrowserHow The Table Appears
MSIE MSIE rendering of BORDERCOLOR=RED
Netscape Netscape's rendering of BORDERCOLOR=RED
In the next page we'll look at how get a little more control over the border colors.

Table Borders: Light and Dark >