XHTML Class Guide and Reference
Make your own web pages

Specifying Colors in the Body Tag

You can set the text, link, and background colors for a page by specifying them in the <body> tag.

If you set any of these colors, or if you are using a background image, set all of them. Visitors may have changed some or all of their default colors and may not be able to read your page otherwise.

<body text="#000000" bgcolor="#ffffff" link="#000099" vlink="#990099" alink="#ff0000">

text is for the color of the text in your page

bgcolor is for the background color of your page itself

link is for the color of unvisited links.

vlink is for the color of visited links.

alink is for the color of active links.

background is for the url of the background image you want to use.

Color considerations

If you use a bgcolor that is not web-safe. It may be very different on visitors' screens than yours. Someone on a web-design mailing list I'm on used a color that she saw as the perfect shade of tan. On my work monitor at the time it looked like pink and purple dots! Not at all the effect that she was looking for.

Use enough contrast. On Macs colors usually look lighter, on PC's they look darker. There is also some variation between different video cards and monitors. If you want everyone to be able to read your page, don't get too subtle. This is one reason it's good to get feedback on how your page looks in different browsers and different computers.

If you use a background image, set the bgcolor to be the same as the main color in the image. Sometimes background images take a long time to load, or fail to load at all. If the bgcolor goes well with the text color, the visitor can still read your page.

For text to be readable on top of a background image, the background image must be subtle and the text color must contrast well with it. If you must use a loud background you will need to put your text inside a table cell or div with a solid background color.