HTML Tags

Himmat Kumar Oct 19, 2023, 8:15 AM
HTML
Views 445
Blog Thumbnail

Table of Contents

  • Understanding HTML Tags
  • Essential HTML Meta Tags
  • Categories of HTML Tags
  • Complete List of HTML Tags
  • Summary

Understanding HTML Tags

HTML tags are essential keywords that define how web browsers format and display content. They help distinguish HTML content from plain text. An HTML tag consists of three main parts: the opening tag, the content, and the closing tag. Some tags, known as self-closing tags, do not require a closing tag.

Basic Structure of an HTML Tag

<tag> content </tag>

Example Tags

  • <p> Hello Students this is a paragraph tag </p>
  • <h2> Hello Students this is heading </h2>
  • <b> Hello Students this text is bold. </b>
  • <i> Hello Students this text is italicized. </i>
  • <u> Hello Students this text is underlined. </u>

Self-Closing HTML Tags

Some HTML tags are self-closing, such as:

  • <br>: Breaks the line.
  • <hr>: Creates a horizontal rule (line).

Essential HTML Meta Tags

  • <!DOCTYPE>: Specifies the HTML version.
  • <title>: Defines the document's title.
  • <link>: Relates the document to external resources.
  • <meta>: Contains metadata about the document.
  • <style>: Contains internal CSS styles .

Categories of HTML Tags

Text Tags

  • Structural: <span>, <p>, <h1>, <h2>, <h3>, <h4>, <h5>, <h6>
  • Text Formatting : <em>, <strong>, <abbr>, <blockquote>, <code>, etc.

Link Tags

  • <a>: Creates hyperlinks.

Image and Object Tags

  • <img>, <object>, <area>, <map>

List Tags

  • Unordered: <ul>, <li>
  • Ordered: <ol>, <li>
  • Description: <dl>, <dt>, <dd>

Table Tags

  • <table>, <tr>, <td>, <th>

Form Tags

  • <form>, <input>, <textarea>, <button>, etc.

Scripting Tags

  • <script> and <noscript>

Complete List of HTML Tags

< td>Contains internal CSS styles.
Tag Description
<!DOCTYPE>Specifies the HTML version.
<html>Root element of an HTML document.
<head>Contains meta-information about the document.
<title>Defines the document's title.
<meta>Provides metadata about the HTML document.
<link>Links to external resources like stylesheets.
<style>
<base>Specifies a base URL for relative URLs.
<header>Represents introductory content or a group of navigational links.
<nav>Defines navigation links.
<section>Represents a thematic grouping of content.
<article>Represents a self-contained composition.
<aside>Contains content indirectly related to the main content.
<h1> to <h6>Define HTML headings, from the most important to the least.
<footer>Represents footer content.
<address>Contact information for the author/owner of a document.
<p>Defines a paragraph.
<hr>Creates a thematic break (horizontal rule).
<pre>Displays preformatted text.
<blockquote>Represents a section quoted from another source.
<ol>Defines an ordered list.
<ul>Defines an unordered list.
<li>Defines a list item.
<dl>Defines a description list.
<dt>Defines a term in a description list.
<dd>Describes a term in a description list.
<figure>Represents self-contained content referenced from the main content.
& lt;figcaption>Provides a caption for a <figure>.
<div>Defines a division or section in a document.
<b>Bold text.
<strong>Important text.
<i>Italic text.
<em>Emphasized text.
<small>Smaller text.
<mark>Highlighted text.
<del>Deleted text.
<ins>Inserted text.
<sub>Subscript text.
<sup>Superscript text.
<u>Underlined text.
<s>Strikethrough text.
<code>Code snippet.
<q>Short inline quotation.
<cite>Title of a work.
<abbr>Abbreviation.
<time>Represents a specific time (date or time).
<data>Links content with a machine-readable translation.
<a>Defines a hyperlink.
<area>Defines a clickable area within an image map.
<map>Defines an image map.
<img>Embeds an image.
<audio>Embeds sound content.
<video>Embeds video content.
<source>Specifies multiple media resources for <audio> and <video>.
<track>Provides text tracks for <video> and <audio>.
<embed>Embeds external content or application.
<object>Embeds an object in HTML.
<param>Defines parameters for <object>.
<table>Defines a table.
<tr>Defines a row in a table.
<th>Defines a header cell in a table.
<td>Defines a standard cell in a table.
<caption>Defines a title for a table.
<thead>Group of header content in a table.
<tbody>Group of body content in a table.
<tfoot>Group of footer content in a table.
<col>Specifies column properties.
<colgroup>Groups columns for formatting.
<form>Defines an HTML form for user input.
<input>Defines an input control.
<textarea>Defines a multiline input control.
<select>Defines a drop-down list.
<option>Defines an option in a drop-down list.
<optgroup>Groups options in a drop-down list.
<button>Defines a clickable button.
<label>Defines a label for an <input> element.
<fieldset>Groups related elements in a form.
<legend>Defines a caption for a <fieldset>.
<script>Embeds JavaScript in the document.
<noscript>Provides alternative content for users with scripts disabled.
<details>Represents a disclosure widget from which the user can obtain additional information.
<summary>Represents a summary or heading for a <details> element.
<dialog>Represents a dialog box or other interactive component.
<canvas>Used to draw graphics on the fly via scripting.
<svg>Defines a container for Scalable Vector Graphics.
<!-- -->HTML comment.

Obsolete Tags

  • <applet>: Used to embed Java applets.
  • <basefont>: Specifies a default font for the document.
  • <big>: Used to make text bigger.
  • <center>: Used to center-align text.
  • <font>: Defines font size, color, and face.
  • <frame>: Defines a particular area of a webpage that can contain another HTML file.
  • <frameset>: Groups frames together.
  • <marquee>: Creates scrolling text.

Note: All HTML tags should be written in lowercase.

Conclusion

HTML is a markup language used to create web pages. It defines the structure and content of a webpage using tags. For example, the

tag defines a paragraph, while the tag defines the most important heading.

Comments

Please login to leave a comment.

No comments yet.

Related Posts

glassmorphism-login-form
241 viewsHTML
Himmat Kumar Mar 4, 2025, 1:15 AM

Glassmorphism Login Form: A Modern Design Tutorial

html-headings-guide
241 viewsHTML
Himmat Kumar Aug 18, 2024, 11:31 PM

Understanding HTML Headings: A Simple Guide

what-is-html-full-explanation
478 viewsHTML
Himmat Kumar Oct 13, 2023, 11:40 PM

What is HTML? Full Explanation and Guide

html-lists-and-links-guide
1011 viewsHTML
Himmat Regar Jun 2, 2025, 6:38 PM

HTML Lists & Links Guide – Correct Markup, Accessibilit...

semantic-html-complete-guide
1381 viewsHTML
Himmat Regar Jun 9, 2025, 5:37 PM

Semantic HTML Explained: Why <header>-<footer> & Friend...

responsive-meta-seo-friendly-markup-2025
433 viewsHTML
Himmat Regar Jun 23, 2025, 4:23 PM

Mastering Responsive Meta & SEO-Friendly Markup in 2025

hyperlinks-and-media-embedding-2025
491 viewsHTML
Himmat Regar Jun 23, 2025, 4:37 PM

Hyperlinks & Media: Embedding Content the Right Way in ...

html-seo-faq-2025
446 viewsHTML
Himmat Regar Jun 23, 2025, 4:41 PM

HTML & SEO FAQ 2025: Answers to the Web’s Most-Asked Qu...

modern-login-form-html-css
247 viewsHTML
Himmat Kumar Mar 4, 2025, 12:57 AM

Creating a Modern Login Form with HTML & CSS

getting-started-with-html-setup-edit-run-code-in-browser
344 viewsHTML
Himmat Kumar Jul 25, 2024, 1:09 PM

Getting Started with HTML: Setup, Edit, and Run Your Co...