HTML Elements
Master this topic with zero to advance depth.
Expert Answer & Key Takeaways
Mastering HTML Elements is essential for high-fidelity technical architecture and senior engineering roles in 2026.
HTML Elements
An HTML element is defined by a start tag, some content, and an end tag.
<tagname>Content goes here...</tagname>The HTML element is everything from the start tag to the end tag:
<h1>My First Heading</h1><p>My first paragraph.</p>
| Start tag | Element content | End tag |
|---|---|---|
<h1> | My First Heading | </h1> |
<p> | My first paragraph. | </p> |
<br> | none | none |
Nested HTML Elements
HTML elements can be nested (this means that elements can contain other elements). All HTML documents consist of nested HTML elements.
The following example contains four HTML elements (
<html>, <body>, <h1> and <p>):<!DOCTYPE html>
<html>
<body>
<h1>My First Heading</h1>
<p>My first paragraph.</p>
</body>
</html>Example Explained
- The
<html>element is the root element and it defines the whole HTML document. It has a start tag<html>and an end tag</html>. Then, inside the<html>element there is a<body>element. - The
<body>element defines the document's body. It has a start tag<body>and an end tag</body>. Then, inside the<body>element there are two other elements:<h1>and<p>. - The
<h1>element defines a heading. It has a start tag<h1>and an end tag</h1>. - The
<p>element defines a paragraph. It has a start tag<p>and an end tag</p>.
Never Skip the End Tag
Some HTML elements will display correctly, even if you forget the end tag:
<html>
<body>
<p>This is a paragraph
<p>This is a paragraph
</body>
</html>However, never rely on this! Unexpected results and errors may occur if you forget the end tag.
Empty HTML Elements
HTML elements with no content are called empty elements. The
<br> tag defines a line break, and is an empty element without a closing tag:<p>This is a <br> paragraph with a line break.</p>HTML is Not Case Sensitive
HTML tags are not case sensitive:
<P> means the same as <p>. The HTML standard does not require lowercase tags, but it is highly recommended for better readability and cleaner code.💡 Quick Task
Take any of your previous code examples and purposefully remove an end tag (like
</h1>). Refresh your browser and see if it looks different. Now, fix the tag and notice the difference!Interview Corner
❓ Interview Question
Q: What is an HTML element?
A: An HTML element is the entire unit consisting of a start tag, its content, and an end tag. For example,
<p>Hello</p> is a paragraph element.❓ Interview Question
Q: What is a root element?
A: The root element is the top-level element of a document that contains all other elements. In HTML, the
<html> tag is the root element.❓ Interview Question
Q: Why should I always use lowercase tags?
A: While HTML isn't case-sensitive, lowercase tags are the industry standard. They are easier to read, look professional, and are required by stricter standards like XHTML.
Course4All Engineering Team
Verified ExpertFrontend Architects
Focused on accessibility, semantic structure, and modern SEO, our frontend team ensures the HTML/CSS curriculum meets 2026 professional standards.
Pattern: 2026 Ready
Updated: Weekly
Found an issue or have a suggestion?
Help us improve! Report bugs or suggest new features on our Telegram group.