11/5/09 – HTML Tutorial 3 Formatting The Text


That is the hello world website. If you have that as your website the text is plain and everything is default. This is how to do some basic formating like size and type and stuff like that. Tomorrow’s tutorial will be how to use colors in the HTML document. The first thing you might want to do is make something bold. Below is how to make the word hello bold.

<b>Hello</b> World

Notice that I used the <b> tag that is how to make something bold. To end the bold tag use </b> you can start and end it anywhere so if you wanted to you could of made just the H bold. After that you might want to make something italicized. Below is how to make World italicized.

<b>Hello</b> <i>World</i>

Notice that I used <i> to start it and </i> to end it, it is kind of like the <b> tag because you can start and stop it anywhere. The next thing you might want to do is make something underlined. Below is how to make the whole thing underlined.

<u><b>Hello</b> <i>World</i></u>

That makes everything underlined and hello bold and world italicized. The next thing you might want to do is make the text a different font. Below is how to make something an arial font.

<font face=”arial”>Hello World

Notice that I did not end it you do not need to end font tags to change font just do it again with a different font name. If you use a font you will need to make sure you are using a web safe font. That means that it works on Macs, Windows, and on Linux. To list more than one font so if one computer does not have it then it will go to the next on you put a coma after the first font and list another. The next thing you might want to do is make a font bigger or smaller. Below is one way to do that.

<font face=”arial”> <font size=”10px”> Hello World

That makes the font size 10 pixels. This is another tag you do not need to end you just enter it in again but a different size to make it bigger or smaller. There is one other way to adjust font size. Below is how to do that.

<h1>Hello World</h1>
<h2>Hello World</h2>
<h3>Hello World</h3>
<h4>Hello World</h4>
<h5>Hello World</h5>
<h6>Hello World</h6>

That makes the font in different sizes 1 is biggest and 6 is smallest. You do need to end this tag before entering in another. Another thing you might want to do is center the text . Below is how to center Hello World.

<center> Hello World </center>

This tag needs to be ended when you want the text to stop being centered. Another thing you might want to do is make a paragraph or break the text. Below is  how to do that with the words hello world.

<p>
Hello
<br>
World
</p>

The <p> tag is how to start the paragraph and the </p> tag is used to end the paragraph it does need to be ended. The <br> tag is used to make a line break or  new line. It does not need to be ended. That is all for this tutorial tomorrow’s tutorial will be on colors.