HTML Help

Basic Codes

     The following codes are some of the most basic but also add a certain style to your website when used to bold, italicize, underline, strike-through your text or to make headers, line dividers, images, etc. Play around with these codes until you feel comfortable with them. After awhile, you will grow more comfortable with using the < bracket > buttons and also the code tags.

Text Codes

Bold: <b> Bold </b>
Italic: <i> Italic </i>
Underline: <u> Underline </u>
Strike-through: <s> Strike-through </s>

Header Codes

Header 1

<h1> Header 1 </h1>

Header 2

<h2> Header 2 </h2>

Header 3

<h3> Header 3 </h3>

Header 4

<h4> Header 4 </h4>

Font Size Codes

Size 1 <font size="1"> Size 1 </font>
Size 2 <font size="2"> Size 2 </font>
Size 3 <font size="3"> Size 3 </font>
Size 4 <font size="4"> Size 4 </font>
Size 5 <font size="5"> Size 5 </font>

     If you look closely you can see the differences between the Header and Font sizes. I prefer to use the Font sizes codes when I wish to manipulate the size of a large amount of text... like a paragrah. Also, if you continue increasing the number (6, 7, 8, 9, etc.), the font gets even larger!

Break Codes

     There are two ways to put in a break in the text. Both are often used, just for different things.

1. Cartridge Break

Code: Example:
The rain in Spain <br> Stays mainly in the plain. The rain in Spain
Stays mainly in the plain.

Remember Tip #1? Well, this Break code is one of the exceptions to the opening tag and closing tag rule. See? It does not have a closing tag. Now in a new version of HTML, called XHTML, the genius programmers who invented this stuff made a closing tag, but since it is not necessary I will not bother you with that. ^.^

2. Paragraph Break

Proper Code: Example:
<p>The rain in Spain is over.</p> <p>Now let us talk about Australia.</p> The rain in Spain is over.

Now let us talk about Australia.

Lazy Code: Example:
The rain in Spain is over. <p> Now let us talk about Australia. The rain in Spain is over.

Now let us talk about Australia.

Note! Okay, the proper way to use the Paragraph code is the top version with an opening tag and a closing tag. However, it is not necessary to do that. The Lazy version, without the closing tag, works just as well and, I admit, I use that one more often myself.

Text Alignment

     You can do even more with the Paragraph codes, too! Try some of the following text alignments:

<p align="left"> To the left we go! </p>
To the left we go!

<p align="center"> Everything to the center. </p>
Everything to the center.

<p align="right"> Moving to the right! </p>
Moving to the right!

     The following code is an alternative way to center a large amount of text. I prefer to use this code.

Center: <center> Center Text </center>

Horizontal Line Dividers

<hr>

     You can also change the width by using the following addition and changing the various percentages to anything you want. (I prefer to stay in the Quarters... 25%, 50%, 75%) Oh, and when you use two or more lines at different widths together, it gives an unique touch to the boring line divider.

<hr width="75%">

<hr width="50%">

<hr width="25%">

     You can also change the color of the line from the drab gray to something that matches the color scheme of your website. (See my Colors page for more colors.)

<hr width="50%" color="darkgreen">


Now let us move on to adding Colors to your site.