How To Create HTML Documents
(Hypertext Markup Language)


Page 1



Take a look at how you web page looks
Click Here


To create a html document you can use an ordinary text program such as word pad, but to make things easier I would suggest a program such as Flexed Ed.
Flexed is a program specifically designed to create html documents.

This is how your document should always begin

<!doctype html public "-//ietf//dtd html//en//3.0">
<html>
<head><title> My Home Page </title>
<META NAME="DESCRIPTION" CONTENT="This is where you put a short description about your web site, no more than 25 words. ">
<META NAME="KEYWORDS" CONTENT="Here you use Keywords to describe your web site. You can use around 300 words or key phrase’s, do not repeat any word or phrases more than twice."> </head>
<body>

This part is called the body.
Everything you want people to see will go here.



When you've finished, you should end the document with these tags.

</body>
</html>



Html Tags

<br> Is The Line Break element which specifies that a new line must be started at the given point.

Here is an example:
One line starts here.<br>
I want another here.<br>
And another here.<br>
One more here.<br>

It will appear like this:
One line starts here.
I want another here.
And another here.
One more here.



<b>...</b> Is the Bold element which specifies that the text should be rendered in boldface, where wanted.

Here is an example:
My name is John Smith and I am <b>single</b>

It will appear like this:
My name is John Smith and I am single


The <u> ... </u> Elements state that the enclosed text should be rendered, underlined.

Here is an example:
This text is <u>underlined</u>

It will appear like this:
This text is underlined


<i>...</i>The Italic element specifies that the text should be rendered in italic font.

Here is an example:
This text is <i>italic</i>

It will appear like this:
This text is italic


<sup>...</sup>Is the element which specifies that the enclosed text should be displayed as a superscript, and using a smaller font (compared with normal text).

Here is an example:
Ronald M<sup>c</sup>Donald

It will appear like this:
Ronald McDonald


<sub>...</sub> Is the element which specifies that the enclosed text should be displayed as a subscript, and using a smaller font (compared with normal text).

Here is an example:
H<sub>2</sub>0

It will appear like this:
H20


<center>...</center> Is the center element and all lines of text between the beginning and end elements are centred between the current left and right margins.

Here is an example:
<center>I want this text to be aligned to the center of the page.</center>

It will appear like this:

I want this text to be aligned to the center of the page.



Text left alone (no tags) will automatically default to the left hand side of the document just like this.


<p align=right></p>All text within the paragraph will be aligned to the right side of the page layout.

Here is an example:
<p align=right>I would like this text aligned to the right</p>

It will appear like this:

I would like this text aligned to the right



This also works with the center and left command as well.


<blink>...</blink> Surrounding any text with this element will cause the selected text to blink on the viewing page. This can serve to add extra emphasis to selected text. (Netscape Only)

Here is an example:
I want this text to <blink>blink</blink>

It will appear like this: (You won't see it because it's only for Netscape)
I want this text to blink

If you were using Netscape you would see this: (I made an animated gif so you could see how it works)
I want this text to


<big>...</big>Is the element which specifies that the enclosed text should be displayed using a big font (compared with the current font).

Here is an example:
I want this text to be <big>larger</big> than the rest.

It will appear like this:
I want this text to be larger than the rest.


<img>The Image element is used to incorporate in-line graphics into an HTML document.

Here is an example:
<img src="photo.jpg" width="206" height="136" border="0">

It will appear like this:



Example 2
<center><img src="photo.jpg" width="206" height="136" border="0"></center>

It will appear like this:



Example 3
<img src="photo.jpg" align="right" width="206" height="136" border="0">

It will appear like this:
















Next       Return to Main page