logo.gif

Creating and Formatting Text

Being able to create and format text the way you want it to appear on a web page is the very essence of HTML. There are several tags that will allow you to display your text:

The <FONT> Tag

The <FONT> Tag is designed to let you create and make modifications to the text on your page but you have to decide which of the <FONT> Tag attributes you need. These are some of the attributes for this tag:

SIZE="1-7"
This attribute will let you enter text sizes from 1 to 7. If you do not enter a specific size 'value' the text will default to a size of 3. 1 is the smallest text size, and 7 is the largest.

<FONT SIZE="2">testing the font size</FONT>

Now change the 2 to any number between 1 and 7. See the difference?

FACE="Font name here"
This attribute will let you define the font you want the text to appear in. If you specify you want your text to show up in Arial, for example, and the person viewing the page doesn't have the Arial font installed on their system then the text will show up in whatever font they have defined as the default font in their browser.

Here is the correct way to use the FACE= attribute:

<FONT FACE="Arial">testing the face attribute</FONT>

Lets say I want to have text show up in Arial, but I know some people don't have Arial, so I want to define a secondary font that they might have. This is easy to do... just type in another font name and separate the two with a comma, like this:

<FONT FACE="Arial,Verdana">testing the face attribute</FONT>

In this example, if I dont have Arial, then the browser will try to show the font in Verdana. If I dont have Verdana, then the text will be displayed in my browser's default font.

COLOR="Color Code or Name here"
This attribute lets you define the color you want your text to appear in. You can use a 6 character color identifier (Hexadecimal Color Code) or the Name of a color.

Try this example on your web page:

<FONT COLOR="black">testing the color attribute</FONT>

This will give you black text. However, you can also use a 6 character Hexadecimal Color Cod to define the color you want. Try this on your web page:

<FONT COLOR="#000000">testing the color attribute</FONT>

This will also give you black text.

Text Formatting Tags

Once you have decided on the size, color and font you wish to use, you can further modify your text by applying one or more of these formatting tags:

Text Formatting Tags:Tags will display:
<B> This text is bolded </B>This text is bolded
<I> This text is italicized </I>This text is italicized
<U> This text is underlined </U>This text is underlined
<TT> This is typewriter text </TT>This is typewriter text
<SUB> This is subscript </SUB>This is subscript (H2O)
<SUP> This is superscript </SUP>This is superscript (ESSOTM)

Special Characters

Some characters will not be shown unless you tell the browser to show them, and some characters are not on the keyboard, so you have to use a "special character" to tell the browser what to display. The character will start with an ampersand (&) and finish with a semicolon (;). These are also case sensitive, so do not use capital letters.

    
    ©   &copy;
    ®   &reg;
    ™   &#153;
    <   &lt;
    >   &gt;
    «   &#171;
    »   &#187;
    ½   &#189;
    é   &eacute;
      Here are a few common special characters, and if you want a complete list, go here.

The most common special character is a blank space.

If you simply hit the space bar between two words, only one space will show up. If you want several blank spaces between words, you have to use the 'non-breaking space' special character: &nbsp;

So if I wanted to space out these two words, I would type this:

Hello &nbsp; &nbsp; &nbsp; Goodbye

and the result would be:    Hello       Goodbye


When you feel comfortable working with and editing text on your page, we need to jazz it up a little with some color:

~~~~~ On to "Using Color On Your Page" ~~~~~