Namecheap

Register a .com domain and get free Whois privacy

Lesson 2: Block Tags

Making Headings

Let's add a large, bold heading to our webpage with the heading tags:

<h1></h1>

In the previous lesson you learned things that appear on web pages are enclosed between the opening and closing body tag, that also includes other tags which affect how things look on web pages:

<body>
<h1>Learning HTML
</h1>
</body>

The number 1 beside the letter h makes the largest heading. Numbers, 2, 3 and 4 will make smaller headings.

Heading tags belong to what are called block tags. These kind of tags don't allow any outside text to line up beside them, you will see the effect in a moment but first let's see how our HTML file is shaping up:

<!DOCTYPE html>

<html>

<head>
<title>My First Webpage</title>
</head>

<body>
<h1>Learning HTML</h1> Look Ma, I'm making a webpage!
</body>

</html>

Open your web page and this is what it should look like:

block tags

Notice that the text outside the h1 tag is on a separate line. This is what block tags do, they force the stuff they don't enclose to be on a separate line.

Another block tag is the paragraph tag:

<p></p>

Any text put between the opening and closing p tags makes one paragraph.

To start a new line within a paragraph the br tag is needed:

<br>

The br tag is one of the few HTML tags which does not have a corresponding closing tag. These kind of tags are called ingle tags. Here is an example of how the br tag can be used in a paragraph:

<p>Look Ma,<br>I'm making a webpage!</p>

The result would look like this:

Look Ma,
I'm making a webpage!

Try it out yourself in the HTML file you made and then let's go to lesson 3.

 

DID YOU KNOW...?
You can register a website address (called a domain in tech talk) even before you have a website. In fact the longer you wait the more difficult it will be to get one that isn't already taken. More Info

DID YOU KNOW...?
There is more to building a website than just making it. It also needs web hosting so that it can be seen on the internet. More Info

Easy Website Builder
Skip the tutorial and build your website or online store without learning any code Tell Me More
html tutorial
This tutorial is available in printable PDF format

Get Your Copy


Disclosure

This webpage contains affiliate links which earn this site a commission should a sale result from a link that has been clicked.