HTML Basic Tags

HTML

Heading Tag

To create headings in HTML we use the following 6 heading tags.


<h1> h1 heading tag </h1>
<h2> h2 heading tag </h2>
<h3> h3 heading tag </h3>
<h4> h4 heading tag </h4>
<h5> h5 heading tag </h5>
<h6> h6 heading tag </h6>

Output

h1 heading tag

h2 heading tag

h3 heading tag

h4 heading tag

h5 heading tag
h6 heading tag

Heading tags are block elements i.e., they have a new line before and after them.

Paragraph Tag

To create paragraph in HTML we use the <p> tag. Example of a paragraph


<p>This is a sample paragraph.</p>

Output

This is a sample paragraph.

Paragraph tags are block elements i.e., they have a new line before and after them.

Horizontal Line Tag

The <hr> is called the horizontal line tag. This is used to create a horizontal line to break up document into parts. Example of horizontal line is given below.


<p>This is a sample paragraph.</p>
<hr>
<p>This is another sample paragraph.</p>

Output

This is a sample paragraph.


This is another sample paragraph.

Break Line Tag

We use <br> tag to create break line. Anything after the br tag starts from the next line. Following is the example of br tag.


<p>This is a sample<br> paragraph.</p>

Output

This is a sample
paragraph.

Code Tag

We use <code> tag to display code in our web page. Example of code tag is given below.

<code> <?php echo "Hello World!"; ?> </code>

Output

<code> <?php echo "Hello World!"; ?> </code>

Preformatted Tag

The preformatted tag <pre> is used to preserve the formating of the document within the enclosed opening and closing pre tag.


<pre>
<?php
	echo "Hello World!";
?>
</pre>

Output

<?php
	echo "Hello World!";
?>

Anchor Tag

The anchor tag <a> is used to create hyper links. Anchor tag has href attribute whose value is set to the link we want to redirect. Following anchor tag will redirect you to the HTML Introduction page of this tutorial on clicking.

<a href="/html/html-introduction"> HTML Introduction </a>

HTML Introduction

We will talk about attribute in the HTML Attributes tutorial.

Image tag

The img image tag is used to display image on the web page. Following is the img tag whose attribute src is set to the dyclassroom logo image.

<img src="https://dyclassroom.com/image/dyclassroom-logo-black-311x48.png">