In an HTML document an HTML element is defined by a start tag, some content in it, and an end tag.
HTML Elements
The HTML element is everything between the start tag to the end tag:
Examples of some HTML elements are given below:
| Start tag | Element content | End tag |
|---|---|---|
| <h1> | This is My First Heading | </h1> |
| <p> | This is My first paragraph. | </p> |
| <br> | none | none |
Note: Some HTML elements don’t have any content (like the <br> element). These type of elements are called empty elements. Empty elements even do not have an end tag!
Nested HTML Elements
HTML elements can be nested. Nested elements means that elements can contain other HTML elements).
All HTML documents contains many nested HTML elements.
The example given below contains four HTML elements (<html>, <body>, <h1> and <p>):
Example
<!DOCTYPE html>
<html>
<body><h1>This is My First Heading</h1>
<p>This is My first paragraph.</p>
</body>
</html>
Example Explained
The <html> element is the root element of HTML document and it defines that this document is a HTML document.
It starts with <html> tag and end with </html> tag.
Then, the <html> element contains another element called <body> element:
<body>
<h1>This is My First Heading</h1>
<p>This is My first paragraph.</p>
</body>
The <body> element defines the body of HTML document.
It starts with <body> tag and ends </body> tag.
Now, you can see that there are two other elements <h1> and
<p><body> element:
<h1>This is My First Heading</h1>
<p>This is My first paragraph.</p>
The <h1> element defines a heading.
It starts with <h1> tag and ends </h1> tag:
<h1>This is My First Heading</h1>
The <p> element defines a paragraph.
It starts with <p> tag and ends </p> tag:
<p>This is My first paragraph.</p>
Never Skip the End Tag
In HTML documents, Some HTML elements will display correctly, even if you forget the end tag:
Example
<html>
<body><p>This is First paragraph
<p>This is Second paragraph
</body>
</html>
However, never rely on this! There may be Unexpected results and errors if you forget the end tag!
Empty HTML Elements
HTML elements which don’t have any content are called empty elements.
The <br> tag defines a line break, it is an empty element and don’t has a closing tag:
Example
<p>This paragraph has <br> a line break.</p>
HTML is Not Case Sensitive
HTML tags are not case sensitive: <P> works same as <p>.
As per HTML standard, lowercase tags are not required, but W3C recommends lowercase in HTML, and demands lowercase for stricter document types like XHTML.