Basic Text Tags :

Return to Index Page

 


Page Formatting :


Before you can begin the body of an HTML page, you've got to format the page as a whole. This formatting is necessary for the Browsers to be able to identify a given page and decode it:


<!DOCTYPE HTML PUBLIC"-//W3C//DTD HTML 4.0 Transitional//EN"> <HTML>
<head>
<title> Title will appear at top of Browser </title>
</head>
<body>
...
...
...
</body>
</html>

Notice the forward slash in the complimentary HTML closing tags. Some HTML tags (commands) require closing tags (turn off switches), and some don't.

Then, where the dots are, you will construct the part of the page that will show in the Browser window.

Headings :

"Heading" text formatting exists as an option, with six sizes, <H1> (the biggest (35point)) through <H6> (too small).

These tags need to be turned off when the duration of the text in the heading is done, with the complimentary </HX> tag, where X=whatever size-number was being used.

Example: <h2>This is a Heading<h2>

A heading will automatically reserve some vertical space below it, before it will allow regular text, or anything else, to start in again. Choice of font is dependant on what the recieving computer has installed on it, and therefore fancy or unusual fonts are never used. If a fancy font is desired, it should be produced as a graphic file in an image editing program, (such as Photoshop or Paintshop-Pro) and positioned on the page as a graphic.

Spacings :

For vertical spacings there's two options, the line break and the paragraph break.

The <br> is the line break, which is the equivelent of a return on a typewriter.

The paragraph break <p> is the one I use more often. It ensures white space between one area of text and the next.

For horizontal spacings of more than one space (which the space bar will do, and all others are ignored by the browser), you put in the following "tag". Use one of these for each space you want, separated from one another :

&nbsp;

These tags do not need complimentary "turn-off" tags.

Regular text :

Regular text has six sizes like with Headings, but the size numbers are backwards relative to the Heading numbering system. A size of one is the smallest rather than the largest, and six is the biggest (I may have heard that there are a few more size options for plain text).

Example: <h2>This is regular text,</h2>

If you just start typing, I believe the default size is 12 point, which I believe is size number 2.

Regular text can also be made bold or italic with the following tags:

<b> or <i>

and then turned off at any time with their compliments

</b> or </i>

Once again, the choice of font is dependant on what the recieving computer has installed on it, and therefore fancy or unusual fonts are never used. If a fancy font is desired, it should be produced as a graphic file in an image editing program, (such as Photoshop or Paintshop-Pro) and positioned on the page as a graphic.

Lists :

Lists can be done as either bulleted (unordered list) or numbered (ordered list). Lists can be nested inside each other, to as many levels as is desired. Here is an example of the html for a bulleted list:

<ul>
<li>First Item
<li>Second Item
<li>Third Item
</ul>

And here is the HTML for a numbered list:

<ol>
<li>First Item
<li>First Item
<li>First Item
</ol>

Colors :

You can color the background of the page, and/or the text and headings, selectively. There are sixteen "pre-defined" colors that can be called out by name, and there are roughly 200 other available colors which can be called out by their hexadecimal number, which is formatted RRGGBB, and needs to have a # symbol in front of it, and be in quotes.

To color the page background, in the body tag (see page formatting above), after the word "body" but before the final >, type bgcolor="#rrggbb". Here is an example:

<body bgcolor="#ff3118">

This instruction would create an orage/red background. See any HTML book for a color chard of the roughly 216 "web-friendly" colors.

For fonts, you use for example:

<font color="red">

This instruction can be in the same set of angle brackets as the font size and font face callout.

Any of these font instructions can be changed at any point in the text, for just one word for example, and then changed back using the

</font color=...

complimentary turnoff tag.

It's done the same way for headings.

Comments - Hidden :

When a page of HTML gets complicated, it can become desireable to put comments in with the HTML that won't show up in a browser window. Then at a later time, when someone else tries to modify the HTML, they can figure out what was being done and why.

Example:

<!--commentary-->