Ep. 003 – Paragraph, Headings and Anchor Tags – Learn HTML & HTML5

In the previous blog post, we have learned how to create a simple HTML page. In this blog post, we will learn how to add paragraphs, headings, and anchor tags (links) to an HTML page.

How to Add Paragraphs to HTML Page?

Paragraphs are used to show text-based information on the website pages. To add paragraphs to the website page, we use the <p> tag. Open the index.html file that you have created in the previous lesson and inside the <body> tag add the following code:

<p>Hello World! I'm learning HTML & HTML5</p>

This code will add a paragraph to the page. Similarly, you can add as many paragraphs as you want. Now save the index.html file and open the file in any browser (e.g. Google Chrome) and you will see the text “Hello World! I’m learning HTML & HTML5”.

How to Add Headings to HTML Page?

Headings are used for adding titles to the website pages. HTML provides six heading variations (H1-H6). H1 is the biggest possible heading and H6 is the smallest possible heading. The following code snippet shows how to add different heading levels to the website page using HTML tags.

<h1>Heading - Level 1</h1>
<h2>Heading - Level 2</h2>
<h3>Heading - Level 3</h3>
<h4>Heading - Level 4</h4>
<h5>Heading - Level 5</h5>
<h6>Heading - Level 6</h6>

Now save the index.html file and open the file in any browser (e.g. Google Chrome) and you will see the headings added to the page.

How to Add Anchor Links to HTML Page?

Anchor links are used to internal or external links to the website pages. The links can be connected to the internal sections of the website or they can be linked to any external website. The <a> tag is used to add links to the HTML website pages. The following code snippet shows how to add an external website link to a website page.

<a href="http://blog.codoplex.com" target="_blank">Link</a>

The href=”” attribute defines the URL of the external website. The target=”_blank” attribute make sure the that external link is opened in a new tab.

Now save the index.html file and open the file in any browser (e.g. Google Chrome) and you will see the link added to the page.

Complete Code:

<p>Hello World!</p>

<h1>Heading - Level 1</h1>
<h2>Heading - Level 2</h2>
<h3>Heading - Level 3</h3>
<h4>Heading - Level 4</h4>
<h5>Heading - Level 5</h5>
<h6>Heading - Level 6</h6>

<a href="http://blog.codoplex.com" target="_blank">Link</a>

Video Tutorial:

How to add paragraphs, headings, and anchor links to Web Page

If you have any questions, please feel free to as in the comments section. Thanks