

How to Change Text Colors

Changing the text color of a web page is accomplished using CSS (Cascading Style Sheets). If you see tutorials showing text color changes using the <body> tag or the <font> tag, it is an outdated tutorial.

To change the text color for an entire web page (the default color is black) you need to code the change you want into an embedded or external style sheet. Here's how to change the text color using an embedded style sheet.

Place the following code into the <head> section of your page code:

<style type="text/css">
body {color: blue;}
With that in the head section of your source code the web page text would be displayed in the color blue. Change "blue" to any official named color or any hexadecimal color to change the text to the color you want.

You can also change a portion of text to another color by using an inline style. Here's how I did that:

<span style="color: green">portion of text to another color</span>
You can add that inline style to a paragraph tag to change an entire paragraph of text, or to division tags, heading tags, or other HTML textual elements.

Tutorials that teach the use of the <font> tag are outdated because the font element is deprecated. Deprecated means it's no longer recommended for use. A deprecated tag can still be used, but it will one day most likely become obsolete. Browsers are not required to support obsolete tags, and most will drop support of obsolete elements sooner or later.

There is more to know about color, but those tutorials are reserved for members. Hey, I have to earn a living you know! Besides, my publisher doesn't want me putting everything out on the web for free because it would make it harder for them to sell my book, Web Site Design Made Easy.

Back | Web Design Tutorials Index

Ezine for Webmasters

Bookmark and Share

Almost a Newsletter

Changing list hosts. Will post a new subscribe form shortly.

Did you know...

See my fancy bottom! :)