INTRODUCTION
Font face and color depends entirely on the computer and browser that is being used to view your page.
So, if you have downloaded a marvellous font that you "adore", and use it on your page....there is a chance that the visitors to your page may not be able to see it, and their browser may display the default font!
Please be aware of this when designing your page. If a particular "rare" font is needed for your page title, for example, then it may actually be a good idea to create a graphic for it instead!
The font attributes are face, size and color.
To change any of the font attributes at any time within your page, simply use the
tag. The text that follows will remain changed until you close with the tag.
You can change any or all of the font attributes at the one time, by including all the required changes within the one
tag.
Changing the font face, color and size.
Will appear as Changing the font face, color and size.
FONT FACE
Remember to always close with the tag.
There are many interesting fonts available for you to use. The default font face is Times New Roman. Some font faces are
Times New Roman
Verdana
Comic Sans MS
WildWest
Bedrock
Now, all five of those font faces look different on my computer, but only two of them are different on my friend's computer!
Remember....if your visitor does not have your font installed on their computer, they will see the default font face instead.
So, I have conducted a series of a Font Face Surveys, so you know roughly which fonts are the most widely supported.
ALTERNATE FONT FACES
Now, we know that your visitor will only be able to see your font if they have that font installed on their computer. So, it is possible to specify two or more font face alternatives by listing the font face names, separated by a comma.
When your page is loaded, their browser will display the first font face that it has available. If none of your selections are installed....then it will display the default font face.
FONT SIZE
There are two ways to change your font size. SPECIFY THE ACTUAL FONT SIZE where "n" is a number from 1 to 7.
Remember to always close with the tag.
Font size="1"
Font size="2"
Font size="3" ...this is the default font size.
Font size="4"
Font size="5"
Font size="6"
Font size="7"
SPECIFY THE RELATIVE FONT SIZE. or .
Basically, you are specifying how many sizes larger or how many sizes smaller than the preset font size.
Font size="-2"
Font size="-1"
Font size="+1"
Font size="+2"
Font size="+3"
Font size="+4"
This is the default size for this font.....now I can change the size with
to make it larger, or
to make it smaller
HEADERS
I have included headers in this section on fonts, even though they are not actually part of the font tag.
Headers are different sizes of font that can be used for headings (surprise!)
The text enclosed within the and
tags will be in bold type, and will be on a separate line from the rest of the text.
There are 6 different sizes of headers. You specify the size by using ....(or 2,3,4,5 or 6) and you must always close with the matching
....(or 2,3,4,5 or 6) tag.
Size 1 header
Size 2 header
Size 3 header
Size 4 header
Size 5 header
Size 6 header
ALIGNING HEADERS
Headers default to the left, but if you add align=right to the header tag, then it will form on the right hand side of your page.
Size 3 header align=right
Size 3 header align=right
Of course, you can also center your header using the and tags.
FONT COLORS
Font colors can also be changed for effect and impact.
You can specify the color that you want by either the color name or hexadecimal code for that color.
COLOR NAMES
.
Remember to include the ". Some browsers will interpret the color without the ", some will not....it is always best to include it!
You must remember to close with
Note....these color names may not be recognised by all browsers.
Some examples of font color names are:
Black
White
PeachPuff
Red
Firebrick
OrangeRed
Blue MidnightBlue
CornflowerBlue
Cyan
Green
DarkGreen
SpringGreen
Yellow DarkGoldenrod
Gold
Burlywood
Purple
Orchid
Magenta
BlueViolet
HEXADECIMAL NUMBER
, where "#rrggbb" is the hexadecimal number.
Remember to include the "#. Some browsers will interpret the color without the "#, some will not....it is always best to include it!
You must remember to close with
Some examples of hexadecimal numbers are:
#000000
#FFE4C4
#CCCC99
#FF8DC
#FA8072
#990000
#FF3030 #000080
#000066
#0000CD
#AFEEEE
#006400
#66FF00
#00B800 #DAA520
#FFCC33
#FFA500
#C71585
#FF00FF
#8B008B
#CC33FF