Commonly Used HTML Tags with Examples

Free Web development courses with real-time projects Start Now!!

HTML tags are keywords used in HTML to display web-pages with certain properties. They are further used for defining HTML elements. An HTML element consists of a starting tag, some content, and an ending tag. The web browser reads the HTML document from top to bottom, left to right. Each HTML tag defines a new property that helps in rendering the website.

HTML Tags

HTML Tags

The ‘<>’ brackets contain an HTML tag. There are two types of HTML tags- empty tags or singleton tags and container tags. Singleton tags or empty tags do not contain any content such as an image or a paragraph and hence do not need to be closed, whereas container tags should be closed.

Syntax

<tag>Some Content</tag>

Examples of:

Empty tag: <br>, <hr>,etc.

Container tags: <p>Paragraph</p>

<a> Link </a>

<!DOCTYPE>
<html>  
<body>  
<p> Paragraph</p>
<h2> Heading</h2>
<b> Bold</b>
<i> Italic</i>
<u> Underline</u>
</body>  
</html>  

Output-

Technology is evolving rapidly!
Stay updated with DataFlair on WhatsApp!!

HTML Tags example

Head tags:
<title>,<style>,<script>,<link>,<meta> and <base>.

Text-formatting tags:
<h>,<b>,<strong>,<small>,<pre>,<i>,<em>,<sub>,<sup>,<ins>,<dfn>,<del>,<div> and <span>.

Link tags:
<a>, <base>.

List tags:
<ul>, <ol>, <li>, <dl>, <dd>

Table tags:
<table> ,<tr> , <td>, <th>, <thead>, <tbody>, <tfoot>.

Form tags:
<form>, <input>, <select>, <option>, <button>, <label>, <fieldset>, <textarea>.

Scripting tags:
<script>, <noscript>

Image and Object tags:
<img>, <figure>, <figcaption>, <area>, <map>, <object>.

HTML attributes are an important component of tags which define its further possibilities and characteristics on the website. Attributes offer further characteristics to an element, for example, its id, class, style, etc. For instance, the ‘href’ in a <a> tag describes what file to open when the anchor is clicked. Each attribute has the format of name=”value” where name is the name of the attribute and value is the particular value that is given to that attribute.

Here is an alphabetical list of tags used in HTML.

Tag nameDescription
<!– –>Defines comments in an HTML document.
<!DOCTYPE>Specifies the version of HTML.
A
<a>Known as the anchor tag. Creates a hyperlink or link.
<abbr>Defines an abbreviation for a long word or sentence.
<acronym>Defines an acronym for a word. (Not supported in HTML5)
<address>It defines the author’s contact information of the web-page.
<applet>Defines an embedded Java applet. (Not supported in HTML5)
<area>This defines the area of an image map.
<article>It defines the self-contained article or content.
<aside>Defines optional content, aside from main content. Mainly represented as a sidebar.
<audio>Embeds sound content in HTML documents.
B
<b>Makes a text bold.
<base>Defines the base URL for all relative URLs within the HTML document.
<basefont>Sets default font, size and color for all elements of a document. (Not supported in HTML5)
<bdi>Provides isolation for that part of text which is formatted in different directions from its surrounding text. 
<bdo>Overrides the current direction of text.
<big>Makes font size one level larger than its surrounding content. (Not supported in HTML5)
<blockquote>Defines content which is taken from another source.
<body>Defines the body or the main content section of an HTML document.
<br>Inserts a single line break.
<button>Represents a clickable button.
C
<canvas>Provides a space for graphics within a web document.
<caption>Defines a caption for the table.
<center>Aligns the content in the center. (Not supported in HTML5)
<cite>Define the title of the work, website, etc.
<code>Displays a part of programming code in an HTML document.
<col>Defines a column within a table which represents common properties of columns, used with the <colgroup> element.
<colgroup>Defines groups of columns in a table.
D
<data>Links the content with the machine-readable translation.
<datalist>Provide a predefined list for input options.
<dd>Provide definition/description of a term in a description list.
<del>Displays a text which has been deleted in an HTML document.
<details>Defines additional details which users can either view or hide.
<dfn>Indicates a term which is defined within a sentence/phrase.
<dialog>Defines a dialog box and other interactive components.
<dir>It is used as a container for directory list of files. (Not supported in HTML5)
<div>It defines a division or section within an HTML document.
<dl>Defines a description list.
<dt>Defines a term in a description list.
E
<em>Emphasizes the content within this element.
<embed>An embedded container for external file/application/media, etc.
F
<fieldset>Groups related elements/labels in a web form.
<figcaption>Adds a caption or explanation for the <figure> element.
<figure>Defines the self-contained content referred to as a single unit.
<font>This defines the font size, family and content for the content section of the HTML document. (Not supported in HTML5).
<footer>Defines the footer of a webpage.
<form>It defines an HTML form.
<frame>Defines a particular area of the webpage which can contain another HTML file. (Not supported in HTML5)
<frameset>Defines a group of Frames. (Not supported in HTML5)
H
<h1> to <h6>Defines headings in an HTML document from level 1 to level 6.
<head>It defines the head of the HTML document that contains all the necessary information for the browser.
<header>Defines the header of a webpage.
<hr>Applies thematic break between paragraph elements.
<html>Represents the root of an HTML document.
I
<i>Represents a text in some different voice or style.
<iframe>Defines an inline frame that embeds other web-pages or content.
<img>Inserts an image within an HTML document.
<input>Defines an input field for the HTML form.
<ins>It represents text that has been inserted within an HTML document.
<isindex>It is used to display search strings for current documents. (Not supported in HTML5)
K
<kbd>Define keyboard input.
L
<label>Defines text label for the input field of form.
<legend>Defines caption for content of <fieldset> element.
<li>Represents items of a list.
<link>Represents a relationship between a current document and an external document or resource.
M
<main>Represents the most important or the main content of an HTML document.
<map>Defines an image map with active areas.
<mark>Represents a highlighted text.
<marquee>Inserts the scrolling image or text either horizontally or vertically. (Not supported in HTML5)
<menu>Creates a menu list of commands.
<meta>Defines metadata of an HTML document.
<meter>Defines scalar measurement with known range or approximate/fractional value.
N
<nav>Represents a section of the page to represent navigation links.
<noframes>Provides alternate content to represent in browsers that does not support the <frame> elements. (Not supported in HTML5)
<noscript>Provides an alternative content if a script is not supported in the browser.
O
<object>Embeds an object in an HTML file.
<ol>Defines an ordered list of items.
<optgroup>Groups the options of a drop-down list.
<option>Defines items in a drop-down list.
<output>Container element which can show the result of a calculation.
P
<p>Represents a paragraph in an HTML document.
<param>Defines parameter for an <object> element
<picture>Defines more than one source element and an image element.
<pre>This defines preformatted text in an HTML document.
<progress>Defines the progress of a task within an HTML document.
Q
<q>Defines a short inline quotation.
R
<rp>It defines an alternative content if the browser does not support ruby annotations.
<rt>Defines explanations and pronunciations in ruby annotations.
<ruby>Represents ruby annotations.
S
<s>Renders text which is no longer correct or relevant.
<samp>Represents sample output of a computer program.
<script>Declares the JavaScript within an HTML document.
<section>Defines a generic section of a document.
<select>Displays control that contains a menu of options.
<small>Makes text font one size smaller than document base font size.
<source>>Defines multiple media resources for different media elements such as <picture>, <video>, and <audio> element.
<span>Styles and groups inline.
<strike>Renders strikethrough the text. (Not supported in HTML5)
<strong>Defines important text.
<style>Contains style information for an HTML document.
<sub>Defines a text that displays as a subscript text.
<summary>This defines a summary which can be used with <details> tag.
<sup>Defines a text which represents superscript text.
<svg>A container of SVG (Scalable Vector Graphics).
T
<table>Creates a table in an HTML document.
<tbody>Displays the body of an HTML table.
<td>Defines cells of an HTML table which contains table data
<template>Contains the client side content which will not display at time of page load and may be rendered later using JavaScript.
<textarea>Defines multiple line input, such as comment, feedback, etc.
<tfoot>It Defines the footer of an HTML table.
<th>Defines the header of an HTML table.
<thead>Groups the header text of an HTML table. 
<time>Defines data/time within an HTML document.
<title>It Defines the title of an HTML document.
<tr>Defines rows in an HTML document.
<track>Defines text tracks for <audio> and <video> elements.
<tt>It Defines teletype text. (Not supported in HTML5)
U
<u>Renders text with an underline.
<ul>Defines an unordered list of items.
V
<var>Defines variable names is used in mathematical or programming contexts.
<video>Embeds a video content in an HTML document
W
<wbr>Defines a position within text where a break line may be possible.

Summary

In this article, we’ve discussed the tags in HTML. HTML tags are of utmost importance. They help in defining elements with varied properties in an HTML document. We’ve looked at some of the commonly used HTML tags- head tags, text-formatting tags, link tags, list tags, table tags, form tags, image and object tags, scripting tags, etc. An alphabetical list of all the tags has been provided.

Your 15 seconds will encourage us to work even harder
Please share your happy experience on Google

courses

DataFlair Team

The DataFlair Team is passionate about delivering top-notch tutorials and resources on programming, Java, Python, C++, DSA, AI, ML, data Science, Android, Flutter, MERN, Web Development, and technology. With expertise in the tech industry, we simplify complex topics to help learners excel. Stay updated with our latest insights.

4 Responses

  1. Lara says:

    Thank you for explaining will definitely give a good reviewwwwwww

  2. Haider says:

    hello sir good website

  3. NAVEEDA says:

    WELL EXPLAINED SIR

Leave a Reply

Your email address will not be published. Required fields are marked *