Basic Web Page Writing Step 18 - Font Sizes and Colors

Basic Guide For Writing Web Pages -- Introduction / Table Of Contents / Previous Page / Next Page

Basic Web Page Writing Step 18
Font Sizes and Colors

Now that you have seen how to change background colors and all the text on a page, lets look at how to change only parts of the text's color and also the size and appearance of the text itself.

This step will show you how change the color of a Header only, or just one word or letter as well as to change size of the font used. The tags you will use are the  and the  as well as the  end tag.

Font Sizes Explained

Font sizes can be expressed either as a size relative to the base font size or an absolute size.
Sizes range from 1 to 7 (absolute number) with the default size being 3. For example this text is being displayed in base font size 3.

Therefore you can format the text font either as an absolute number between 1 and 7, or you can format it as Base Font Size=+1 which would displayed as base font size 4.(default plus 1).

To explain it a bit better see the following chart:

This is font size =1: Absolute 1
This is font size =2: Absolute 2
This is font size =3: Absolute 3
This is font size 3, the default: Same as above
This is font size=+1: Default +1 which would be the same as absolute 4
This is font size=+2: Default +2 which would be the same as absolute 5
This is font size=+3: Default +3 which would be the same as absolute 6
This is font size=+4: Default +4 which would be the same as absolute 7

Changing Font Size

From the chart above, you see you can use either the option  or  to get the same size text.

The following example will change several words in the sentence to various sizes.
Working is sections will make it easier to follow

See how
 easy 
it is to
change sizes.

Which displays as:

See how easy it is to change font sizes.

Actually it is easy but can get a bit confusing. Notice in the above example no tags were used so the text still appears as one line. It is easer to write it in this manner so it is easier to follow.

Changing Colors Of Words Or Letters.

The format is the same for changing the color of words and letters. The same format is used except the Font Color=# is used along with the hexadecimal number for the color as you saw in step 17.

Look at the following example as we add color to words in a sentence. We will also make the font size larger to make it easier to read.

This line is
going to get
 real colorful
 since we are
 using the Font
 Color option.

Which would produce the following:

This line is going to get real colorful since we are using the Font Color option.

There are many ways that you will be using these options, but again don't get carried away, Use them to draw attention to parts of your page that you want a person to see. Remember to check them out carefully before you upload them to your server.

In step 19 you will see how to add a background image to your page instead of colors.

STEP 19 -- Background Graphics

Basic Guide For Writing Web Pages -- Introduction / Table Of Contents / Previous Page / Next Page

created by Larry Curreri,

last modified: January 14, 2002

This page hosted by Get your own Free Home Page

Basic Guide For Writing Web Pages -- Introduction / Table Of Contents / Previous Page / Next Page