Basic HTML - Heading Tags

You can have a nice big heading on your web page quite easily. This is done with the H tags. The biggest size heading you can have is H1. If you want smaller sized headings then you change the number after the H. You can have up to 6 different sizes. All headings need to go between the two BODY tags.
Try it out for yourself. Open up the code for your firstwebpage.html file, if it's not already open. (If it's not, you can now right-click and Send To > Notepad. If you didn't get this working then simply click File > Open from the menu at the top of your text editor.)
Add the following just below your first BODY tag:

<H1>A Size 1 Heading</H1>

Incidentally, tags are not case sensitive. So you can have this:

<h1>A Size 1 Heading</h1>

Or even this:

<h1>A Size 1 Heading</H1>

But using all capital letters makes your code more readable.
Once you've added the H1 tags, though, your HTML should look like this:

To see what it looks like, open Windows Explorer or Finder on the Mac, if it's not already open. Navigate to where you saved your web page to, and then double click to open it up. (If you already have the page open, simply press F5 to refresh the page.) You should see this in your browser:

Switch back to your code and change the 1's into 3's. So your HTML heading should now be this:

<H3>A Size 3 Heading</H3>

Save the changes. Go back to your browser and press F5 to refresh the page. You should see this:

Notice how much smaller the H3 heading is compared to the H1 heading. (If your headings don't look right, make sure you haven't missed any angle brackets out, or any forward-slash closing tags.)

Exercise
Try the other H numbers to see how they compare. You can only go as far as H6.

In the next lesson, we'll take a look at paragraph breaks

Posted in: Tips,Trick,Tutorial,Web Design,Web Design 2 (Basic HTML Tags)