Course Content
HTML Introduction
0/1
HTML Editors
0/1
HTML Basic Tags
0/1
HTML Elements
0/1
HTML Attributes
0/1
HTML Headings
0/1
HTML Paragraph
0/1
HTML Text Formatting
0/1
HTML Meta Tags
0/1
HTML Quotations
0/1
HTML Comments
0/1
HTML Images
0/1
HTML Background
0/1
HTML Colors
0/1
HTML Lists
0/1
HTML Tables
0/1
HTML Forms
0/1
HTML Spell Check
0/1
HTML Media
0/1
HTML Marquees
0/1
HTML CSS
0/1
HTML Links
0/1
HTML Block & Inline
0/1
HTML Classes
0/1
HTML Id
0/1
HTML I frames
0/1
HTML Java script
0/1
HTML File paths
0/1
HTML Layout
0/1
HTML Responsive
0/1
HTML Computer Code
0/1
HTML Tutorial
About Lesson

HTML Elements

In this tutorial, we will learn about the elements in HTML and difference between Elements and Tags with the help of examples.


Elements

A Tag/Element usually consists of an opening tag (), a closing tag (), and some content in between. Tags are case-sensitive.

Syntax :

<tag_name>...content...</tag_name>

Example :

<!DOCTYPE html>
<html>
  <head>
    <title>Hello!</title>
  </head>
  <body>
    <h1>This is simple heading.</h1>
    <br>
    <p>This is a simple paragraph.</p>
    <hr>
  </body>
</html>

Elements in above example

Start/Opening Tag Some Content End/Closing Tag
<h1> My First Heading </h1>
<p> This is a simple paragraph </p>
<br /> none none
<hr /> none none

Note : <br /> and <hr /> tags are void tags.


Difference between Elements and Tags

A Element usually consists of an opening tag <tag_name>, a closing tag <p>, and some content in between.

For Example : <h1> is opening tag of heading and </h1> is a closing tag of same heading but <h1> My first heading </h1> is a heading element.


Nested HTML Tag

The tag inside the other tag is known as nested tag.

HTML can be nested(elements can contain other elements).

Example :

<!DOCTYPE html>
<html>
  <head>
    <title>Hello!</title>
  </head>
  <body>
    <h1>Hello World!</h1>
    <p>This is a simple paragraph.</p>
  </body>
</html>

Output

Hello World!

This is a simple paragraph.

Explanation of above example

The <html> tag is root element of document. Inside <html> tag we have nested two elements <head> and <body>.
Inside the <head> tag we have nested a <title> tag.
And inside the <body> tag we have nested two tags <h1> and <p> tag.


Never Forget the Closing Tag

  • Some HTML elements will display correctly, even if you forget the closing tag.
  • It is necessary to write closing tag, If you forget to put end tag you will get unexpected results or errors may occur.
Exercise Files
No Attachment Found
No Attachment Found
error: Content is protected !!