HTML Elements

HTML elements are the names of the starting tags of your HTML code. When you find an element containing additional content you will see that it ends up using a closing tag has a forward slash with the name of the element.

Here are some of the common examples of elements and how they are written.

tagExample
<p><p>Paragraph elements are used for giving paragraph spacing to statements.</p>
<h1><h1>Heading elements are used to provide a heading to articles of your web page.</h1>
<br/><br/>Line break is used to provide carriage return or going to the next line.

Difference between Tags and Elements

This is one of the most famous questions in HTML as what might be the actual difference between a tag and an element? You can say that an HTML element consists of a starting tag always. When the HTML element holds sub content or some other content within it, then it will end up with an ending tag.

Nested HTML Elements

Elements can be nested, which means you can write an element and before closing that element you can start as well as finish another element within that outer element. This is very much possible to keep one element within another. Here's a simple example of such a situation:

Example:
<!DOCTYPE html>
<html>
<head>
    <title>Example for Nested HTML Elements</title>
</head>

<body>
    <p>This is my paragraph text with <strong>bold</strong> word.</p>
</body>
</html>

Here the <strong>….</strong> is used to make your text bold. Here paragraph tag acts as an outer element and strong tag acts as an inner element which can be called as nesting of elements.

HEADING Elements or <hn> Elements

Any content or article starts having a nice heading, provides the headline or the topic name of any document.

Similarly, in HTML code also, different sizes of heading can be given on your web page. HTML allows six sizes for heading that uses elements name in the format of <hn>, where n starts from 1 till 6; like this:

<h1>, <h2>, <h3>, <h4>, <h5>, and <h6>

It is to be noted that, when you will implement any heading tag, the web browser will automatically add one line prior and one line following that heading to make the heading looks neat.

Example:
<!DOCTYPE html>
<html>

<body>
    <h2>This is page heading of size 2.</h2>
    <h3>This is heading of size 3.</h3>
    <h5>This is heading of size 5.</h5>
</body>
</html>

Why is the heading element important?

Heading plays an important role because search engines usually implement the headings for indexing the composition as well as the content of the web page(s). Moreover, users can make their lookup easier if your pages contain headings. Also, having a heading can make your web article more readable and neat to understand.


Scroll Back to Top