HTML Elements Explained: Essential Tags and Attributes
Table of Content:
Elements gives structure to a HTML document and tells the browser how you want to present your website. Generally elements consists of a start tag, some content, and an end tag.
Let's look some basic tags-
| Start Tag | Element Content | End Tag |
|---|---|---|
| <p> | Paragraph content. | </p> |
| <h1> | Heading content. | </h1> |
So here <p> Paragraph Content</p> is an HTML element, <h1> Heading Content </h1> is another HTML element.
There are some HTML elements which don't need to be closed, such as
<img> ,
<br> ,
<hr> elements.
Because of having no elements these are known as void elementsor empty elements.
Nested HTML Elements
HTML allowed to keep one Element inside another Element −
<span class="pln"> </span><span class="dec"><!DOCTYPE html></span><span class="pln"> </span><span class="tag"><html></span><span class="pln"> </span><span class="tag"><head></span><span class="pln"> </span><span class="tag"><title></span><span class="pln">Nested HTML element</span><span class="tag"></title></span><span class="pln"> </span><span class="tag"></head></span><span class="pln"> </span><span class="tag"><body></span><span class="pln"> </span><span class="tag"><h1></span><span class="pln">This is Heading</span><span class="tag"></h1></span><span class="pln"> </span><span class="tag"><p></span><span class="pln">This is Paragraph.</span><span class="tag"></p></span><span class="pln"> </span><span class="tag"><b></span><span class="pln">This is bold text</span><span class="tag"></b></span><span class="pln"> </span><span class="tag"></body></span><span class="pln"> </span><span class="tag"></html></span><span class="pln"> </span>
Live Preview
-
In this example, the
<html>element defines the whole document with start tag<html>and end tag</html>. -
<head>element defines the head part of the document with start tag<head>and end tag</head>. -
<title>element defines the title of this document with start tag<title>and end tag</title>. -
<body>element defines the document body with start tag<body>and end tag</body>. -
<body>element defines the document body with start tag<body>and end tag</body>. -
<h1>element defines the heading with start tag<h1>and end tag</h1>. -
<p>element defines the paragraph with start tag<p>and end tag</p>. <b>element defines the bold content with start tag<b>and end tag</b>.
- Question 1: Do all character entities display properly on all systems?
- Question 2: Can attribute values be set to anything or are there specific values that they accept?
- Question 3: What are applets?
- Question 4: When is it appropriate to use frames?
- Question 5: Inline-level element in HTML?
- Question 6: block-level element in HTML?