Site hosted by Angelfire.com: Build your free website today!




<BGSOUND loop="1" src="images/felicity.mid">






Go to Angelfire






Back to Main Page






E-mail me! Click here!

Take Control of Your Color Scheme


The first step in creating an excellent page is picking out colors. You can define the background color or pattern, text color, link color, and visited link color. The HTML necessary to do this is a series of attributes added to the <body> tag. The complete tag looks like this:

<body bgcolor="#xxxxxx" text="#xxxxxx" link="#xxxxxx" vlink="#xxxxxx" alink="#xxxxxx">

BGCOLOR is the background color of the page. TEXT is the principal text color found on the page; always make sure that this color is visible on the background you choose. LINK is the color of any hypertext that has not been visited yet. VLINK is the color of visited hypertext; and ALINK is the color of an active link (Selected, but not followed).

In place of "xxxxxx" enter one of these hexidecimal codes:
Black = 000000
White = FFFFFF
Grey = 999999
Brown= 7F2301
Purple = CC33FF
Red = FF0000
Yellow = FFFF66
Green = 00FF00
Blue = 0000FF
Lt. Blue = 00CCFF

Or you could click here to view the full 216 color pallette.

It should also be noted that one must be careful when typing in color commands. If spelled "colour", the attributes will not function, and will default to the browser's settings. This can be a mixed blessing at best...

Lastly, you may notice through experimentation (or by accident, like myself) that color hexcodes will work without the pound (#) symbol, and sometimes even without the quotation marks. This is true, but a thousand time please leave them in there. Most older browsers require them to function properly. No one wants to deny his or her guests, even if they are using Netscape 2.0 or older. This applies to most any attribute value throughout HTML.

Using Background Images

If you have a background image (wallpaper) you would rather use instead of a flat color, enter:
<body background="yourfilenamehere.gif"> in place of <body bgcolor="#xxxxxx">.

This will create a tiled background images behind all other items on the page. The background image will scroll with the text and other images on the page. At some point, you may wish to create a background image that does not move, but instead has text and other objects scroll over the top of it. This can be accomplished either with javascript, or by adding "bgproperties=fixed" to the <body> tag, like this:

<body bgproperties="fixed" background="yourimage.jpg">

That's all there is to coloring your page. Easier than crayons, huh?

The really technical stuff:

For those of you who want to know more (I know you're out there, don't be bashful), the hexidecimal codes above are codes your computer uses to recognize the red/green/blue pattern that makes up a particular color, much the way a color television does. An explanation of how hexidecimals function is extremely complicated, and requires a considerable knowledge of math. If you feel up to the challenge, the rewards for your page can be quite impressive. This information can be found by clicking here.


Click a link below to jump to that page
Main Page Basic HTML Change Your Page's Colors
Changing Text Styles Changing Fonts Size, Face, and Color Centering, Line Breaks, Paragraphs, and more
Marquees Setting up Links & Hypertext E-mail Links
Building and Using Lists Special HTML Symbols Make Downloads Availible on Your Site
Headers and Title Lines Adding Graphics/Graphics as Links Basic Dividers
Adding Multimedia All About Tables Common HTML Errors
Customizable Forms Setting Up Your Page in FramesCascading Style Sheets
Fun with Javascripts