October 23, 2006 12:10 AM

CHAPTER EIGHT:

Extensions

INDEX: 01) What Are Extensions?; 02) The Tag; 03) The <BASEFONT> Tag; 04) The Text Color Of A Web Page; 05) Changing The Link Colors; 06) The <BLINK> Tag; 07) Different Ways To Number In Lists; 08) Different Bullet Types In Lists

01) WHAT ARE EXTENSIONS?

Extensions are HTML tags that did not exist when HTML first became a language, but were added later (by Netscape, originally). These extensions are being used by other browsers now. All of these tags may not necessarily be read by other browsers, but most are.

02) THE TAG

The first tag is a tag. turns it off, of course.

The tag will adjust the size of any text placed between the two tags. Here's the format for this tag:

Text here

In the above tag, 'number' will be a number between one and seven, with one being a very tiny print and seven being a huge print. So, if a small print is needed, this tag can be used:

This is small.

The above font would look like this:

This is small.

If a huge print is needed, put '7' in place of the '2'. Here's an example of a larger font:

This is large.

The above font would look like this:

This is large.

The standard or average size of normal text on a Web page is 3. This is called the BASE FONT. Read the next section for more information on the base font.

What's the difference between the tag and the <H1> tags? The tags can be used anywhere in any text. You can even mix and match fonts within a paragraph. An <H1> tag puts all of the text on one line; there can be no mixing and matching.

It's also possible to change the typeface of a Web page from within the tag by including FACE=font-type.

This is using font size 5 with technical as the font type.

Result: This is using font size 5 with courier as the font type.

If your computer doesn't support the 'TECHNICAL' font, it won't show up as 'technical'. All of this tutorial, unless otherwise stated, is created using the ARIAL font.

03) THE <BASEFONT> TAG

The base font is the size of print the Web page uses as the standard for that Web page. 3 is the size used as the average base font. Remember that the base font must be a number between one (1) and seven (7). It is possible to change the BASE FONT in a Web page to any number, 1 to 7. The tag to change the base font is: <BASEFONT SIZE=number> , where 'number' is the new number between 1 and 7. If a base font is set at the beginning of a Web page, it becomes the default font size of the whole page.

What is the advantage of this? By setting a base font, you can set up relative font sizes based on whatever the base font is. In plain English, a relative font size is one that is so many sizes larger or smaller than the base font.

will tell your browser to display the text in a font size that is three (3) times smaller than the base font established at the beginning. To get larger fonts, a plus sign is used; for instance, will tell the browser that the text is to be displayed two (2) times larger than the base font.

Please note that if you do NOT use , the new tag will continue to be in effect until it is turned off.

Be very careful of setting the font size to a large size for the entire Web page, as it can make the Web page longer and more difficult to read. Also, be careful about setting the font size to a very small size, as it can make it more difficult to read.

04) THE TEXT COLOR OF A WEB PAGE

Typically, browsers display all of the text in black. However, browsers allows a user to change the color of text in a Web page from within the <BODY> tag. Colors are assigned #'s (numbers). Below is a chart of a few basic colors:

#000000 is Black
#FFFFFF is White
#FF0000 is Red
#00FF00 is Green
#0000FF is Blue
#FFFF00 is Yellow
#00FFFF is Aqua
#FF00FF is Lilac

Each 6-digit number representing a color is made up of numbers 0 through 9 and letters A through F. The ascending sequence would be 0,1,2,3,4,5,6,7,8,9,A,B,C,D,E,F. Each 6-digit number is broken down into three (3) parts. The first two (2) numbers represents the RED value, the second set of two (2) numbers represents the GREEN value, and the third set of two (2) numbers represents BLUE. So, in essence, you might say that the number is #RRGGBB, where 'R' indicates 'RED', 'G' indicates 'GREEN', and 'B' indicates 'BLUE'. This 6-digit number is called the RGB value.

Although all of the colors given in the chart above consist of 0's and F's, any of the above numbers/letters can be used to create unique colors.

Here is the tag for changing the color of your text:

Keep in mind that "#xxxxxx" is the value of the color you are wishing to use, using 0 through 9 and/or A through F.

What color do you think the text would be in the example above? If you guessed green, you are absolutely correct!

Have you noticed that none of the Web pages on this site are created using black text?

05) CHANGING THE LINK COLORS

It is possible to change the link colors also. LINK specifies a new link not ever used, VLINK specifies visited links, and ALINK specifies an active link. As with changing the text color, link colors are changed from within the <BODY> tag. Here is the format for changing link colors:

To mix text color and link colors, put them all in one tag. There is always only ONE (1) <BODY> tag in a document. Here is the format for changing the text and link colors:

06) THE <BLINK> TAG

The <BLINK> tag causes text to blink on and off when viewed in a browser. Here is the tag format:

<BLINK>This is blinking.</BLINK>

This tag can become quite a nuisance on a Web page. My advice? Use this tag very sparingly, if at all.

If you aren't using specific versions of specific Web browsers, for instance, Netscape, the <BLINK> tag probably isn't working above. Lucky you, if this is the case. There are also other ways to cause text/images to blink, but that goes beyond the scope of HTML and this tutorial.

07) DIFFERENT WAYS TO NUMBER IN LISTS

To review, <OL>, </OL>, and <LI> are the tags for a numbered list. For an in-depth review, please read HTML Chapter 3.

For each <LI> in the list, browsers include a number to the left of the item, beginning with the number 1 automatically. Browsers allow users to define a different numbering method, in addition to the one previously mentioned. Here's the tag:

where 'type' is either l (12th letter of the alphabet, lowercase), a, A, i, or I (9th letter, uppercase). Please refer to the chart (notice that it's in a table) below for clarification of each of these.

TYPE

NUMBER METHOD

EXAMPLE

l

Standard Numbers

1, 2, 3, 4, etc.

a

Lowercase Letters

a, b, c, d, ect.

A

Uppercase Letters

A, B, C, D, etc.

i

Lowercase Roman Numerals

i, ii, iii, iv, etc.

I

Uppercase Roman Numerals

I, II, III, IV, etc.

Using the information in the chart above, if we wanted to cause your browser to generate lowercase Roman numerals, the tags would be:

...
<OL TYPE=i>
<LI>First item
<LI>Second item
</OL>
...

The above list would look like this:

First item
Second item
Third item

To cause your browser to generate uppercase letters, use this format:

...
<OL TYPE=A>
<LI>First item
<LI>Second item
<LI>Third item
</OL>
...

The above list would look like this:

First item
Second item
Third item

08) DIFFERENT BULLET TYPES IN LISTS

The basic bullet is a small circle. In my opinion, the best way to get a cool-looking bullet is to use an <IMG> tag that refers to a bullet image somewhere. But, if you prefer to leave graphics out of it, browsers have a <UL> tag for extra bullet choices. Here's the format:

where 'type' can be either the standard disc, a circle, or a square. Here's a sample of the code using a square, a circle, and a disc:

<UL TYPE=square>
<LI>Square
</UL>
<UL TYPE=circle>
<LI>Circle
</UL>
<UL TYPE=disc>
<LI>Disc
</UL>

Here's the output of the code above:

Square

Circle

Disc

Once again, all of the bullets in the above example may look the same, depending upon which Web browser you are using.

Enjoy creating your own forms in the future! Good luck!

HTML TUTORIAL

Tutorial Introduction	Introduction
Getting Started	How to Get Started
Table of Contents	Table of Contents
Chapter One	WHAT IS HTML?
Chapter Two	FORMATTING IN HTML
Chapter Three	LISTS
Chapter Four	LINKS
Chapter Five	IMAGES
Chapter Six	TABLES
Chapter Seven	FORMS
Chapter Eight	EXTENSIONS
Chapter Nine	TIPS ON CREATING GREAT WEB PAGES