Exercise - Working with fonts

The Web browser ultimately determines font size, color and family, but you can can gain some degree of control over fonts with the <FONT> .... </FONT>tag and it's attributes of SIZE, COLOR and FACE. Be aware that fonts may look larger on a PC than a Mac due to monitor resolution differences.

You can change the size of the fonts by either specifying a number, or in a relative fashion by specifying how many sizes larger or smaller that the default font size.  This gives a more graceful looking font than using a header <H1.....H6> tag, but it doesn't provide the line break that the header tag does. You must remember to add a <P> or <BR> tag manually.

Font COLOR

Font colors are specified by using either the hexadecimal code or the color name as we learned with the body tag attributes. The format is:

Font FACE

The difficulty in specifying font face is that the user must have that font installed on their computer, though you can specify alternatives by separating them with a comma. If the first is not installed, the second will be displayed and so on. If none are available, the default font is subsituted. It's best to include a broad catagory such as sans serif, serif or mono so the look can at least be approximated on different systems. Bottom line though - if the font is critical to your design, use a graphic of it instead.

Exercise 1. Enter the following somewhere in the body of your HTML document:

<FONT SIZE=7>FirstName LastName</FONT><BR>

<FONT SIZE=6 COLOR=""#3300FF"">Life Sciences</FONT><BR>

<FONT SIZE=5 COLOR=""#FF3300"" FACE="ARIAL">University of Illinois</FONT>