HTML Elements

An HTML element is nothing but a starting tag and then some content and then the closing tag. So we can say HTML elements is everything from the starting tag to the ending tag.

For example:

<tagname>some content</tagname>

Now taking a real time example:

<h1>This is my first heading</h1>

Note: In HTML, we have some special elements which has no content. For example the <br> element. So these elements are called empty elements. In simpler words, we can say that empty elements do not have an end tag.

Nested HTML elements:

In HTML, the elements can be nested which means HTML elements can contain other elements. All the HTML documents consist of nested HTML elements. The following example has four HTML elements:

1. <html>
2. <body>
3. <h1>
4. <p>

Example:

<html>
<body>
<h1>Apple</h1>
<p>An apple is an edible fruit produced by an apple tree (Malus domestica). Apple trees are cultivated worldwide and are the most widely grown species in the genus Malus. The tree originated in Central Asia, where its wild ancestor, Malus sieversii, is still found today</p>
</body>
</html>

Output:

Therefore, in this basic example, we can clearly see that how HTML elements contain other elements. So, in that example as we can see that we have <html> element, it is known as the root element and it is used to define the whole html element. It has a starting tag and ending tag as well but as we can see between those tags we have many elements like <body> tag which is used to define the documents body. It has a starting tag and closing tag as well. And as we can see inside body element, we have two other elements namely <h1> tag and <p> tag. <h1> element defines a heading it also has opening and closing tag as well. And that <p> element defines a paragraph. It also comes with a starting and closing tag.

Never skip the End Tag:

There are some elements in html which will display correctly even after you have forgot to input the ending tag. For example: <p> tag. But we should not rely on this because at the time of execution, it may come up with unexpected errors, if you forget the ending tag. The following example shows that how a paragraph tag works without its ending tag.

For example:

<html>
<body>
<p>This is an paragraph without its ending tag
<p>This is also an paragraph without its ending tag
</body>
</html>

Output:

Empty HTML Tag:

HTML elements with no content are called empty elements. For example: <br> tag is used to define a line break in html, and it is an empty element because it does not have a closing tag. And when a tag does not have end tag so there is no point in giving that element a content. So that’s how empty html elements work.

For example:

<html>
<body>
<p>This is a <br> paragraph with a line break.</p>
</body>
</html>

Output:

HTML is not case sensitive:

HTML is not a case sensitive language means <p> is same as <P>. In html, standard does not require lowercase tags.

HTML Tags:

There are several html tags like <html>, <body>, <h1>……to <h6>. And we have different descriptions to each of these tags.