HTML Elements
HTML
An HTML element is the starting tag and ending tag along with its contents.
HTML Elements are the small unit of web pages.
Element has start tags and end tags and content between them.
Element is the HTML small piece of unit
A complete form of HTML tags.
Learning with HTML Editor "Try it Now"
You can edit the HTML code and view the result using online editor.
HTML Element
An element is everything between the start tag and the close tag.
<h1>This is a heading element</h1>
<p>This is a paragraph element.</p>
HTML Element with attribute
An element can have zero or more attributes, some elements have mandatory attributes.
<h1 id="mh" style="color:red;">This is a heading element</h1>
<p class="mp" style="border:1px solid blue;">This is a paragraph element.</p>
HTML Empty Element
An element can be empty if there is no body or content of the element(<br/>, <hr/>). In that case the element can be written in short form by a tag and followed by a forward-slash.
<h1 id="mh" style="color:red;">This is a heading element</h1>
<br/>
<p class="mp" style="border:1px solid blue;">This is a paragraph element.</p>
<hr/>
HTML Nested Element
An element can be nested by other elements. The inner element is called child or nested element and the outer element is called parent or nesting element.
In code bellow body is the nesting element for section element where h1 and p are nested by section element.
<body>
<section>
<h1>This is a heading element</h1>
<p>This is a paragraph element.</p>
</section>
</body>
Elements Example
Example
<!DOCTYPE html>
<html>
<head>
<!-- This is title element -->
<title>HTML Element Example</title>
<!-- This is style element -->
<style>
.sec{
padding: 25px;
background-color: #808080;
border-radius:5px;
}
</style>
</head>
<body>
<!-- HTML Element Example -->
<h2>HTML Element Example</h2>
<section class="sec">
<h1 id="mh" style="color:white;">This is a heading element</h1>
<br/>
<p class="mp" style="border:1px solid blue;">This is a paragraph element.</p>
<hr/>
<p>This is another paragraph.</p>
</section>
</body>
</html>
Click on the "Try it Now" button to see how it works.
Note: For a complete list of all available HTML tags, visit HTML Tag List