A Comprehensive Guide to HTML Tags


HTML tags are elements that define the structure and content of a web page. They are used to create headings, paragraphs, lists, tables, forms, images, and other types of content that are displayed on a web page.

Each HTML tag has a specific purpose and meaning. For example, the <h1> tag is used to create a main heading on a page, while the <p> tag is used to create a paragraph of text. Some HTML tags are self-closing, meaning they don't require a closing tag, while others, such as <p>, require both an opening and closing tag to enclose the content.

HTML tags can also be styled using CSS (Cascading Style Sheets) to add visual effects, such as changing the font size, color, and background of elements.

It's important to understand the purpose and meaning of HTML tags in order to effectively create and structure web pages. Understanding the basics of HTML tags is a fundamental step in learning web development and creating dynamic, interactive websites.

Here is a list of commonly HTML tags:

  • <html>: The root element of a HTML document. It represents the entire HTML document and contains all other elements.
  • <head>: Contains information about the document, such as the title of the page, meta information, and links to other resources, such as CSS and JavaScript files.
  • <title>: Specifies the title of the document, which is displayed in the browser's title bar or tab.
  • <body>: Contains the main content of the document, such as text, images, and other HTML elements.
  • <header>: Represents a container for introductory content or a set of navigational links.
  • <nav>: Defines a section of a page that contains navigation links.
  • <main>: Specifies the main content of a document, which is unique to that document and excluding content that is repeated across a set of documents, such as site navigation, headers, and footers.
  • <footer>: Represents a container for the footer of a document or section. It typically contains information about the author, copyright information, and links to related documents.
  • <section>: Defines a section of a document, such as a chapter or an introduction.
  • <article>: Specifies independent, self-contained content, such as a blog post or a forum post.
  • <aside>: Represents a section of a page that contains content tangentially related to the main content, such as a sidebar.
  • <h1> to <h6>: Define headings of different levels, with <h1> being the most important and <h6> the least important.
  • <p>: Defines a paragraph of text.
  • <a>: Defines a hyperlink, which links to another page or a specific location on the same page.
  • <img>: Embeds an image in the document.
  • <ul>: Defines an unordered list, which is a list of items with bullet points.
  • <ol>: Defines an ordered list, which is a list of items with numbers or letters.
  • <li>: Defines a list item in an ordered or unordered list.
  • <table>: Defines a table for displaying data in rows and columns.
  • <thead>: Specifies the header content in a table.
  • <tbody>: Specifies the body content in a table.
  • <tr>: Defines a row in a table.
  • <th>: Defines a header cell in a table.
  • <td>: Defines a regular cell in a table.
  • <form>: Defines a form for user input.
  • <input>: Defines a form control where the user can enter data, such as a text field, checkbox, or radio button.
  • <label>: Defines a label for a form control, which provides a description for the control.
  • <select>: Defines a drop-down list for selecting one or multiple options from a list of predefined options.
  • <option>: Defines an option in a drop-down list created with the <select> element.
  • <textarea>: Defines a multi-line text input control.
  • <button>: Defines a clickable button for submitting a form or triggering an action.
  • <style>: Defines a section for CSS styles in a document.
  • <script>: Defines a section for JavaScript code in a document.
Tag Description
<!-- -->apply comment in an HTML document.
<!DOCTYPE>specify the version of HTML
<a>anchor tag and it creates a hyperlink or link.
<abbr>abbreviation for a phrase or longer word.
<acronym>acronym for a word. (Not supported in HTML5)
<address>author's contact information of the HTML article
<applet>embedded Java applet. (Not supported in HTML5)
<area>area of an image map.
<article>self-contained content.
<aside>content aside from main content. Mainly represented as sidebar.
<audio>embed sound content in HTML document.
<b>make a text bold.
<base>base URL for all relative URL within the document.
<basefont>set default font, size and color for all elements of document. (Not supported in HTML5)
<bdi>provide isolation for that part of text which may be formatted in different directions from its surrounding text.
<bdo>override the current text direction.
<big>make font size one level larger than its surrounding content. (Not supported in HTML5)
<blockquote>content which is taken from another source.
<body>body section of an HTML document.
<br>apply single line break.
<button>represent a clickable button
<canvas>graphics space within a web document.
<caption>caption for a table.
<center>align the content in center. (Not supported in HTML5)
<cite>define the title of the work, book, website, etc.
<code>display a part of programming code in an HTML document.
<col>column within a table which represent common properties of columns and used with the <colgroup> element.
<colgroup>group of columns in a table.
<data> link the content with the machine-readable translation.
<datalist>predefined list for input option.
<dd> provide definition/description of a term in description list.
<del>text which has been deleted from the document.
<details>additional details which user can either view or hide.
<dfn> indicate a term which is defined within a sentence/phrase.
<dialog>dialog box or other interactive components.
<dir>container for directory list of files. (Not supported in HTML5)
<div>division or section within HTML document.
<dl>define a description list.
<dt> define a term in description list.
<em> emphasis the content applied within this element.
<embed>embedded container for external file/application/media, etc.
<fieldset> group related elements/labels within a web form.
<figcaption> add a caption or explanation for the <figure> element.
<figure>self-contained content, and s mostly refer as single unit.
<font>font, size, color, and face for the content. (Not supported in HTML5)
<footer>footer section of a webpage.
<form> define an HTML form.
<frame>particular area of webpage which can contain another HTML file. (Not supported in HTML5)
<frameset>It defines group of Frames. (Not supported in HTML5)
<h1> to <h6>headings for an HTML document from level 1 to level 6.
<head>head section of an HTML document.
<header>header of a section or webpage.
<hr> apply thematic break between paragraph-level elements.
<html>root of an HTML document.
<i> represent a text in some different voice.
<iframe>inline frame which can embed other content.
<img> insert an image within an HTML document.
<input>input field within an HTML form.
<ins>text that has been inserted within an HTML document.
<isindex> display search string for current document. (Not supported in HTML5)
<kbd> define keyboard input.
<label>text label for the input field of form.
<legend>caption for content of <fieldset>
<li> represent items in list.
<link>relationship between current document and an external resource.
<main>main content of an HTML document.
<map>image map with active areas.
<mark>highlighted text.
<marquee> insert the scrolling text or an image either horizontally or vertically. (Not supported in HTML5)
<menu>creating a menu list of commands.
<meta>metadata of an HTML document.
<meter>scalar measurement with known range or fractional value.
<nav>section of page to represent navigation links.
<noframes>alternate content to represent in browser which does not support the <frame> elements. (Not supported in HTML5)
<noscript>alternative content if a script type is not supported in browser.
<object> embed an object in HTML file.
<ol>ordered list of items.
<optgroup> group the options of a drop-down list.
<option> define options or items in a drop-down list.
<output>container element which can show result of a calculation.
<p>paragraph in an HTML document.
<param>parameter for an <object> element
<picture>more than one source element and one image element.
<pre>preformatted text in an HTML document.
<progress>progress of a task within HTML document.
<q>short inline quotation.
<rp>alternative content if browser does not supports ruby annotations.
<rt>explanations and pronunciations in ruby annotations.
<ruby> represent ruby annotations.
<s>It render text which is no longer correct or relevant.
<samp>sample output of a computer program.
<script> declare the JavaScript within HTML document.
<section>generic section for a document.
<select>control which provides a menu of options.
<small> make text font one size smaller than document?s base font size.
<source>>multiple media recourses for different media element such as <picture>, <video>, and <audio> element.
<span>styling and grouping inline.
<strike> render strike through the text. (Not supported in HTML5)
<strong> define important text.
<style> contain style information for an HTML document.
<sub>text which displays as a subscript text.
<summary>summary which can be used with <details> tag.
<sup>text which represent as superscript text.
<svg>container of SVG (Scalable Vector Graphics).
<table> present data in tabular form or to create a table within HTML document.
<tbody>body content of an HTML table and used along with <thead> and <tfoot>.
<td>cells of an HTML table which contains table data
<template> contain the client side content which will not display at time of page load and may render later using JavaScript.
<textarea>multiple line input, such as comment, feedback, and review, etc.
<tfoot>footer content of an HTML table.
<th>head cell of an HTML table.
<thead>header of an HTML table. It is used along with <tbody> and <tfoot> tags.
<time> define data/time within an HTML document.
<title>title or name of an HTML document.
<tr>row cells in an HTML table
<track>text tracks for <audio> and <video> elements.
<tt>teletype text. (Not supported in HTML5)
<u> render enclosed text with an underline.
<ul>unordered list of items.
<var>variable name used in mathematical or programming context.
<video> embed a video content with an HTML document
<wbr> position within text where break line is possible