corner filler corner
 
Description Mascot

Text/Note Pad Page Building Tutorial

We are now going to discuss and demonstrate the uses of simple hex color commands to inform the browser what color specifications you want the following areas listed below.

  
corner

filler

 corner

You may use our Hex Color Specification Viewer or RGB Generator and choosing hex colors if you are unfamiliar with Hex specifications.

To create a color for background you simply add the Hex value to your <BODY> of document.

Install Background Color to Body tag:
--> bgcolor="#0000FF"

Cut & Paste Code Below:

Now Body should look something like this:
<BODY bgcolor="#0000FF"

If you wanted an image for background rather than a color, you would substitute bgcolor for this code:
--> background="yourimage.jpeg"

Cut & Paste Code Below:

Now Body would look something like this:
<BODY background="yourimage.jpeg"

We recommend the use of background color being added in addition of your choice of image for background (If background image is used). This ensures that viewers that have all images turned off on their browser get a uniform look to your Web page in event that default color of "white" would not look good. We use this type of body command in all our pages that use background images.
--> <BODY bgcolor="#0000FF" background="http://www.your domain/yourimage.jpeg"

Cut & Paste Code Below:

Now Body would look something like this:
<BODY background="yourimage.jpeg"

We will now add a text color: (not always necessary, as font command later discussed in tutorial will provide color. This is often used in cases of java scripts that use visual text displayed, to know what color it should produce text. May also be used for font face command later discussed in tutorial.)
--> text="#ffffff"

Cut & Paste Code Below:

Now the Body tag should look something like this:
<BODY bgcolor="#0000FF" background="http://www.your domain/yourimage.jpeg" text="#ffffff"

We will now instruct what color links should be.

Install link color specification:
--> link="#FFCC66"

Cut & Paste Code Below:

Now Body tag should look something like this:
<BODY bgcolor="#0000FF" background="http://www.your domain/yourimage.jpeg" text="#ffffff" link="#FFCC66"

Install visited link color specification:
vlink="#CCCCCC"

Cut & Paste Code Below:

Now Body should look something like this:
<BODY bgcolor="#0000FF" background="http://www.your domain/yourimage.jpeg" text="#ffffff" link="#FFCC66" vlink="#CCCCCC"

Install active (color when clicked) link color specification:
--> link="#0000FF"

Cut & Paste Code Below:

Now Body should look something like this:

Note: Your image for background can also be placed in an "image folder" on your server, as our images are placed in. You would then name this as following.
"http://www.yourdomain/images/yourimage.jpeg"
On your server, you can bypass "http://www.yourdomain" by simply using "images/yourimage.jpeg" and browser will default looking for image off your server. Your image can be many different types like gif, jpg, art, bmp and others, just name accordingly.

Your Pad Editor should look something like this now, depending on colors you choose to use.

We will move onto installation of content and images on next tutorial page.