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 with a forward slash with the element’s name.
HTML Elements is a combination of HTML tags and content. The HTML element is between the start tag and the end tag; This is called an HTML element; It is important to have your content in it; Otherwise, it will be called only a tag.
Here are some of the common examples of elements and how they are written:
tag | Example |
<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. |
Table of Contents
- Difference between Tags and Elements
- Nested HTML Elements
- HEADING Elements or Elements
- Why is the heading element important?
Difference between Tags and Elements
This is one of the most famous HTML questions: 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, 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 and finish another element within that outer element. It’s 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 a strong tag acts as an inner element, which can be called 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 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 essential role because search engines usually implement the headings for indexing the composition and 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.