You are using a previous version of Active Jump.

Go To Current Version of This Page

Active Jump Logo


Information
The Basics
Text
Pictures
Spacing
Colors
Links
Alignment
Lists/Bullets
Tables
Frames
Multimedia
Forms
ISO Characters
Meta Tags
Contact Us


Email Support
Email Contact

Divider

Text Color
Introduction
Creating different colored text, can really make your site attractive and creative. In this step, you will be learning how to change the color of text.
Text Color
There are two ways to set the color of the text. One way, is simply put the tags around the text. The other way is to set the default color of the text. Here are the two ways of doing it.

Normal

The normal way to set the color of the text, is to put the color tag around the selected text. The tag looks like <FONT COLOR="#xxxxxx">. The starting tag is <FONT COLOR="#xxxxxx"> and the closing tag is </FONT>. The xxxxxx stands for the color code. The text between these two tags is the text that is the selected color. An example of this is:

index.html - Notepad
....<BODY>

<FONT COLOR="#0000FF"> Hello World! </FONT>

</BODY>....

My Homepage - Microsoft Internet Explorer
Hello World!



Default

The other option is to set the default color of the text, so you don't have to specify it each time like in the Normal technique. The default text tag looks like <BODY TEXT="#xxxxxx">. This tag replaces the normal <BODY> tag. Here is an example of the default text color technique:

index.html - Notepad
....<BODY TEXT="#0000FF">

Hello World!

</BODY>....

My Homepage - Microsoft Internet Explorer
Hello World!



Link Color
There are two ways to set the color of the links. One way, is simply put the tags around the text that is withen the link tags. The other way is to set the default link color. Here are the two ways of doing it.

Normal

The normal way to set the color of the link, is to put the color tag around the selected text that is within the link tag. The tag looks like <FONT COLOR="#xxxxxx">. The starting tag is <FONT COLOR="#xxxxxx"> and the closing tag is </FONT>. The xxxxxx stands for the color code. The text between these two tags is the text that is the selected color. An example of this is:

index.html - Notepad
....<BODY>

<A HREF="file.html">

<FONT COLOR="#0000FF"> Click Here! </FONT>

</A>

</BODY>....

My Homepage - Microsoft Internet Explorer
Click Here!



Default

The other option is to set the default color of the link, so you don't have to specify it each time like in the Normal technique. The default link tag looks like <BODY LINK="#xxxxxx">. This tag replaces the normal <BODY> tag. Here is an example of the default link color technique:

index.html - Notepad
....<BODY LINK="#0000FF">

<A HREF="file.html">

Hello World!

</A>

</BODY>....

My Homepage - Microsoft Internet Explorer
Click Here!



Visited Link Color
A visited link color is the color a link is if you have previously visited it. The tag to set the color for the visited link is <BODY VLINK="#xxxxxx">. This tag replaces the normal <BODY> tag. Here is an example of the visited link color tag:

index.html - Notepad
....<BODY VLINK="#0000FF">

<A HREF="file.html">

Click Here

</A>

</BODY>....

My Homepage - Microsoft Internet Explorer

Click Here!



Active Link Color
An active link color is the color a link turns when you click on it. The tag to set the color for the active link is <BODY ALINK="#xxxxxx">. This tag replaces the normal <BODY> tag. Here is an example of the active link color tag:

index.html - Notepad
....<BODY ALINK="#0000FF">

<A HREF="file.html">

Click Here

</A>

</BODY>....

My Homepage - Microsoft Internet Explorer

Click Here!



Combining the Tags
As you may have noticed, many of the tags above replace the <BODY> tag. However, you are not allowed to have more than one <BODY> tag. Because of this, there is a way to put all of the tags into one single tag. This is done, simply by combining them all and dropping off the BODY part of the tag. So the completed tag would look like:

<BODY TEXT="#xxxxxx" LINK="#xxxxxx" VLINK="#xxxxxx" ALINK="#xxxxxx">

index.html - Notepad
<BODY TEXT="#000000" LINK="#0000FF" VLINK="#0000FF" ALINK="#0000FF">

Normal Text

<P>

<A HREF="file.html"> Link </A>

</BODY>....

My Homepage - Microsoft Internet Explorer
Normal Text

Link

HTML Color Chart
Select the color you want the HTML code for below, and it will appear in the form below the color chart. If you would like a floating window of this color chart, please click here.

Color Code:

Test Your HTML
Printer Friendly Version


Jonathan David VerLee
webmaster@activejump.com


White