The <b>bold</b>, <i>italic</i> and <u>underline</u> tags are used to make text either bold, italic or underlined.

You put the <b> tag where you want to begin the bold text and the </b> tag where you want the bold text to end.

In this example the word bold will be displayed in bold text:

In this example the word <b>bold</b> will be displayed in <b>bold</b> text

And here is the example with the bold tags applied:

In this example the word bold will be displayed in bold text

And now we will use the same example to display the <i> and </i> tags which are used to create italic text.

In this example the word <i>italic</i> will be displayed in <i>italic</i> text

And here is the example with the italic tags applied:

In this example the word italic will be displayed in italic text

And last but not least is the same example to display the <u> and </u> tags which are used to underline text.

In this example the word <u>underline</u> will be displayed <u>underlined</u>

And here is the example with the underline tags applied:

In this example the word underline will be displayed underlined

Paragraph & line break tags

<p> paragraph & <br> line break tags

The <br> tag is used to cause a line break. It causes the text following the <br> tag to be on the next line. I use it to seperate lines on an address.

For example if you go:

John Doe
<br>
5515 S Mill Avenue
<br>
Tempe, AZ
<br>
85281

It will be displayed as:

John Doe
5515 S Mill Avenue
Tempe, AZ
85281

The <p> tag is used to cause a paragraph break. It causes a blank line to be inserted where the <p> is used.

In this example I took 3 paragrahps from an article on the death of Robin Williams and used a <p> tag to seperate that paragrahps.

This is how you would type up the text:

SAN RAFAEL, Calif. - Robin Williams took his own life by hanging himself at his San Francisco Bay Area home, sheriff's officials said Tuesday.
<p>
Marin County Sheriff's Lt. Keith Boyd said Williams was found in a bedroom by his personal assistant on Monday at his Tiburon home.
<p>
Boyd said toxicology tests will be performed and the investigation is ongoing

And this is how the text looks when it is displayed.

SAN RAFAEL, Calif. - Robin Williams took his own life by hanging himself at his San Francisco Bay Area home, sheriff's officials said Tuesday.

Marin County Sheriff's Lt. Keith Boyd said Williams was found in a bedroom by his personal assistant on Monday at his Tiburon home.

Boyd said toxicology tests will be performed and the investigation is ongoing

Drawing lines - Horizontal Rule or <hr> tag

If you want to draw a horizonatl line across your web page you use the <hr> tag. The letters hr stand for

horizantal rule

If you code several <hr> tags like this

<hr>
<hr>
<hr>
There are 3 lines above this text and 3 lines below this text
<hr>
<hr>
<hr>

When the above HTML is displayed it will look like this:

---

---

---

There are 3 lines above this text and 3 lines below this text

---

---

---

Indenting text

I use the <blockquote></blockquote> tags to indent stuff

I lot of times when I have examples I like to indent the stuff in the example to make the example easier to understand.

That is done by wrapping the text you want to indent in <blockquote> tags.

Here is an example using the <blockquote> tags.

This is the top text that is not indented.
<blockquote>
This is the text that is indented with the "blockquote" tags
</blockquote>
This is the bottom text that is not indented.

And this is how the data looks when the previous example is displayed:

This is the top text that is not indented.

This is the text that is indented with the "blockquote" tags

This is the bottom text that is not indented.

Images

You display images with this HTML tag

<img src="filename">

To display the micky mouse image I uploaded to your webs site you used the tag

<img src="0_images/micky_mouse.png">

And it looks like this:

The "0_images" directory. That is the subdirectory that your images are in. The path changes from where your at. I will explain that latter.

For useless information image files usually end in .jpg, .jpeg, .gif and .png

Probably the most common endings are .jpg and .gif

Images on the left or right

A lot of times you want to hang images on the right or the left of your text so they look like this:

A set of 911 tapes that a prosecutor tried to withhold from a grand jury proved instrumental in helping acquit two brothers who had been indicted on charges of murder and aggravated assault in a 2007 gang shootout. On Tuesday after listening to the tapes in detail, a Maricopa County Superior Court jury came back with six not-guilty and six deadlocked verdicts against Jonathon Mena Cobian, 27, and his half-brother John Mitchell Mena, 25.

A set of 911 tapes that a prosecutor tried to withhold from a grand jury proved instrumental in helping acquit two brothers who had been indicted on charges of murder and aggravated assault in a 2007 gang shootout. On Tuesday after listening to the tapes in detail, a Maricopa County Superior Court jury came back with six not-guilty and six deadlocked verdicts against Jonathon Mena Cobian, 27, and his half-brother John Mitchell Mena, 25.

You can do that by hanging either

class="image_right"

or

class="image_left"

On the <img> tag like this

<img src="image file" class="image_right">

or

<img src="image file" class="image_left">

Now for this web page I have already defined the classes of

image_right
image_left

With these CSS statements:

.image_right { margin-left:3px; float:right; }

.image_left { margin-right:5px; float:left; }

<hn> tags </hn>

<h> tags stand for Header tags.

<h> tags are used to display titles.

The smaller the number the bigger the text

<h> tags look like this:

<h1>text for h1 tag</h1>
<h2>text for h2 tag</h2>
<h3>text for h3 tag</h3>
<h4>text for h4 tag</h4>
<h5>text for h5 tag</h5>
<h6>text for h6 tag</h6>

When the previous <h> tags are displayed they will look like this

text for h1 tag

This is the text that is displayed under the h1 tag.

text for h2 tag

This is the text that is displayed under the h2 tag.

text for h3 tag

This is the text that is displayed under the h3 tag.

text for h4 tag

This is the text that is displayed under the h4 tag.

text for h5 tag

This is the text that is displayed under the h5 tag.

text for h6 tag

This is the text that is displayed under the h6 tag.

Linking to other web pages

Using the <a> tag

A lot of times you will want a person to be able to click on something on your web page and then jump to something on either another of your web pages, or to a web page at some other site.

That is done with the <a> tag.

For example if you click on this it will jump to a web page on this site named mike2.html and if you click on this you will jump to the home page of the Arizona Republic which is at the website azcentral.com.

The syntax of the <a> is:

<a href="where_to_jump">"text_to_display"</a>

"where_to_jump" is either the file name on your website to jump to, which in this example would be

mikes2.html

or the file on some other website to jump to, which in the case of the Arizona Republic would be

http://azcentral.com

"text_to_display" is the text or image to display.

When you click on the "text_to_display" the browers jumps to the web page defined by "where_to_jump".

In this example of an <a> tag it displays the word "frog" and when you click on "frog" it jumps to the web page mike2.html at this website.

<a href="mike2.html">frog</a>

And here is the example coded. When you click on the word frog it will jump to the web page mike2.html at this website

frog

In this example of an <a> tag it displays the words Arizona Republic and when you click on "Arizona Republic" it jumps to the default web page at the Arizona Republic website.

<a href="http://azcenteral.com">Arizona Republic</a>

And here is the example coded. When you click on the words "Arizona Republic" it will jump to the main web page at http://azcentral.com.

Arizona Republic