HTML Tags List reference

HTML Tags List Reference

This page contains the list of all HTML tags for your reference.

Main root Tag

The html tag is the main root tag under which all the tags will reside.

Tag/Element Attribute Description
<html> mainfest defines url document caches mainfest(deprecated) instead use <link rel=">"

Meta tags

Meta tags gives the high level information about the web page. This is an important factor for SEO(Search Engine Optimization). This informs the browser about the below important head(<head>) information like <meta><base>, <basefont>, <link>, <title>, <style>.

Tag/Element Attribute Description
<head> attribute Represents head section of the HTML document.
<meta> charset, content, http-equiv, name Describes the metadata of HTML page where it contains page description, author of the page, keywords.
<base> href, target Describes the base URL to all other relative URLs.
<basefont> color This tag is used to specify font size, color and font family for the document.(Deprecated)
<link> crossorigin, href, hreflang, importance, integrity, media, referrerpolicy, rel, sizes, type Describes the metadata of HTML page where it contains page description, author of the page, keywords.
<title> NA Describes the base URL to all other relative URLs.
<style> scoped, type, media This tag is used to specify font size, color and font family for the document.

Root Tag

The body tag is the root tag which contains the details which is displayed to the user.

Tag/Element Attribute Description
<body> background, bgcolor root tag which displays the actual content in the browser

Basic HTML Tag

These basic HTML tags are the tags which will be present in most of the html document. These are the most common tags.

Tag/Element Attribute Description
<!DOCTYPE> attribute Describes the document type.
<html> mainfest Describes an HTML document.
<head> charset, content, http-equiv, name Represents head section of the HTML document.
<title> NA Describes the title of HTML document.
<body> background, bgcolor Describes content of the document.
<h1> to <h6> NA Describes headings in HTML document.
<p> NA Describes a paragraph.
<br> NA It is used to give line breaks.
<hr> align, color Represents thematic break between paragraph level elements in HTML document.
<!--...--> NA This tag is used to insert comment inside document code

Html tags for text formatting & semantic inline text element

The lists of tags below are for text styling and formatting which is categorized as text and text related formatting. These tags also helps to design the inline texts of an element.

Tag/Element Attribute Description
<a> NA To set up links between pages
<abbr> NA Specifies abbreviations.
<acronym> NA Describes an acronym.(Deprecated) Use instead.
<address> NA We can provide contact details of page author using <address> element.
<b> NA Describes bold text.
<bdi> NA BDI means Bi-Directional Isolation. It formats the text in different direction.
<bdo> NA Describes bi-directional override of the text.
<blockquote> NA The HTML blockquote element is used to format a block of text as a long quote which is indented more than the surrounding text.
<center> NA Moves text to center. (Deprecated) Use CSS instead.
<cite> NA It specifies the work title.
<code> NA Specifies text in computer code.
<del> cite, datetime It defines deleted text in HTML document.
<dfn> NA Defines the definition term in HTML.
<em> NA Formats text in document to emphasized text.
<font> color It defines font face, size, and text color. (Deprecated) Use CSS instead.
<i> NA Formats text in document to italic text.
<ins> cite, datetime Describes inserted text in HTML document.
<kbd> NA Denotes the text given by user that is keyboard input.
<mark> NA Describes the marked text.
<meter> form, hight, low, max, min, optimum, value Within the predefined range
<pre> NA Describes preformatted text in HTML page.
<progress> form, max, value Progress of any task is defined by progress bar.
<q> cite Declares short quotations.
<rp> NA This tag is used to help browsers which don’t support by ruby annotation.
<rt> NA Specifies character pronunciation of ruby annotations.
<rtc> NA Specifies semantic pronunciation of ruby annotations.
<ruby> NA Specifies a ruby annotation which is used to show many East Asian languages.
<s> NA Defines strikethrough text
<samp> NA To enclose text inline to show sample output of computer program
<small> NA To make the text smaller in size
<span> NA Container for inline elements and contents.
<strong> NA To make text bold and important
<sub> NA To add subscript
<sup> NA To add superscript
<time> datetime Shows time
<tt> NA Teletype Text element
<u> NA Underlines text
<var> NA Creates variable which can be used for mathematics
<wbr> NA Represents word break

Lists tags

List helps to created a related set of data. All the List tags are below-

Tag/Element Attribute Description
<ul> attribute Represents an unordered list.
<ol> reversed, start Represents an ordered list.
<li> value Represents a list item.
<dir> NA Represents a directory list.(Deprecated)
<dl> NA Represents a description list.
<dt> NA Represents term in description list.
<dd> NA It Represents term description in description list.
<menu> NA Represents the list of commands which is used to build menus.
<menuitem> NA Represents the command that the user can invoke from a popup menu.

Link tags

The Links tags sets the hyperlinks which is a connection between 2 web pages. The tags are – 

Tag/Element Attribute Description
<a> download, href, hreflang,media, type, ping, referrerpolicy, rel, shape, target Specifies a hyperlink.
<link> crossorigin, href, hreflang, importance, integrity, media, referrerpolicy, rel, sizes, type This tag links External style sheets. It is located in section of HTML document.
<nav> NA Specifies navigation links

Tags for videos/audios(media tags)

Using HTML5, it is easy to embed the media like audio & video. The tags for videos/audios are – 

Tag/Element Attribute Description
<audio> autoplay, buffered, crossorigin, controls, muted, loop, preload, Represents embed audio in web page.
<source> media, sizes, src, srcset, type Describes multimedia resources of <audio> and <video>
<track> src, srclang, default, kind, label, Describes text track for media of element <audio> and <video>
<video> src, width, height, autoplay, buffered, crossorigin, controls, muted, loop, preload, poster Represents embed video in web page.

Tags for Images

There are multiple tags for images. The most important tag is <img> which can use other image related tags as well.

Tag/Element Attribute Description
<img> alt, align, border, buffered, crossorigin, decoding, height, width, importance, intrinsicsize, ismap, loading, referrerpolicy, sizes, src, srcset, usemap Represents an image.
<map> name Represent map within <img> tag. And the image map contains clickable areas.
<area> ping, referrerpolicy, rel, shape, target, alt, coords, download, href, hreflang, media, It is used to define area inside an image-map, where it contains clickable region on an image map.
<canvas> width, height This tag in HTML5 is used to draw graphics on web page using JavaScript.
<figcaption> NA This tag gives Caption to <figure> element. This can be placed as first or last child of <figure> element.
<figure> NA It defines media content with captions. Content of <figure> element belongs to main flow.
<svg> NA It is a language used to describe 2D graphics and graphical applications in XML.

Table tags

These tags helps in creating tables. The most important tags are <table>, <th>, <tr> and <td>. The complete list of table tags are –

Tag/Element Attribute Description
<table> align, background, bgcolor, border, summary Specifies table in HTML.
<caption> align Specifies a table caption.
<th align, background, bgcolor, colspan, headers, rowspan, scope Specifies a header cell in a table.
<tr> align, bgcolor Specifies a row in a table.
<td> align, background, bgcolor, colspan, headers, rowspan Specifies a cell in a table.
<thead> align The Header content in the table is grouped using <thead> tag.
<tbody> NA The body content in the table is grouped using <tbody> tag.
<tfoot> align, bgcolor The footer content in the table is grouped using <tfoot> tag.
<col> align, bgcolor Defines the properties for each column within colgroup.
<colgroup> align, bgcolor, span It is used to specify a group of one or more columns in a table for formatting.

List of Input and Form Tags

Most of the good looking interactive website contains forms. The most important tag is <form> and it also contains other  input form tags and other form tags –

Tag/Element Attribute Description
<form> target, accept, accept-charset, action, autocomplete, enctype, formaction, method, name Form is used in all the websites to collect information about user who visits your website.
<input> accept, alt, autocomplete, autofocus, checked, dirname, disabled, form, formaction, formenctype, formnovalidate, formtarget, height, list, max, maxlength, minlength, min, multiple, name, patteren, placeholder, readonly, required, size, src, step, type, usemap, value, width It is an input field where user can give there details in the given form.
<textarea> autocomplete, autofocus, cols, dirname, disabled, enterkeyhint, form, inputmode, maxlength, minlength, name, placeholder, readonly, required, rows, wrap Represent a multi-line plain-text editing control.
<button> type, value, autofocus, disables, form, formaction, formenctype, formmethod, formnovalidate, formtarget, name, type Creates various clickable buttons like submit, reset, cancel, ok and many more.
<select> autocomplete, autofocus, disabled, form, multiple, name required, size Describes a drop-down list.
<optgroup> disabled Display group of options related lists in the form of drop down list.
<option> disabled, selected, value Displays option in drop down list.
<label> for, form Describes text label with a form <input> field.
<fieldset> name, disabled, form To form related data in group <fieldset> element is used.
<legend> for, form, name Represent caption of <fieldset> element.
<datalist> NA The pre-defined option is specified in drop down list.
<output> for, form, name Declares results of calculation
<meter> form, hight, low, max, min, optimum, value The pre-defined option is specified in drop down list.
<progress> form, max, value Declares results of calculation

Html style tag

The <style> tag adds style to the HTML document.

Tag/Element Attribute Description
<style> scoped, type, media used to embed CSS properties

Html tags semantics & content sectioning

These tags helps to create the outline of the content so that you can arrange the content of your document in a structured way.

These tags are important to create modern good looking websites.

Tag/Element Attribute Description
<div> width, height It is used to create layout of webpage.
<span> NA It is used as container for inline elements and contents.
<header> NA Specifies a group of introductory contents or navigation links.
<footer> NA It Specifies footer for page or section. Footers are located in bottom of the page.
<main> NA Specifies the main content of a page.
<section> NA Specifies document section.
<article> NA It specifies article in a document.
<aside> NA Specifies some other content which aside from the main content.
<details> open It gives more details to user. Where user can view or hide the details.
<dialog> NA Defines a dialog box or window.
<summary> NA Defines a visible heading for a <details> element.
<data> value Links the given content with a machine-readable translation.
<address> NA It gives more details to user. Where user can view or hide the details.
<h1> to <h6> NA Defines a dialog box or window.
<nav> NA Defines a visible heading for a <details> element.
<hgroup> NA Links the given content with a machine-readable translation.

Frame tags

The frame tags controls how iframe related properties are set. The most important tag is <iframe>.

Tag/Element Attribute Description
<frame> align, allow, csp, height, importance, loading, name, referrerpolicy, sandbox, src, srcdoc, width Represents frame window in a frameset.(Deprecated)
<frameset> NA Represents set of frames.(Deprecated)
<noframes> NA Displayed only by the browsers that do not support <frame> tag.(Deprecated)
<iframe> NA Iframes is known as inline frame. It allows us to present a webpage within same webpage.

Html Scripting tags & embedded HTML contents

Few Developers call these as Programming tags but these are scripting tags.

Tag/Element Attribute Description
<script> align, alt, code, codebase Describes client- side script that is JavaScript
<noscript> NA When scripts or disabled <noscript> tag provides alternative details to the users.
<applet> align, alt, code, codebase Defines an embedded applet.(Deprecated) use <embed> or <object> instead
<embed> height, src, type, width Specifies container for an external application or interactive content into HTML document.
<noembed> NA Specifies container for an external application or interactive content into HTML document.
<object> width, border, data, form, height, name, type, usemap It is used embed multimedia in HTML document like video, audio, Java applets, ActiveX, PDF, and Flash.
<param> name, value Specifies a parameter for an object.
<picture> NA It is used embed multimedia in HTML document like video, audio, Java applets, ActiveX, PDF, and Flash.
<source> NA Specifies a parameter for an object.

Html5 tags

These tags are recent addition as part of HTML5.

Tag/Element Attribute Description
<article> attribute It specifies article in a document.
<aside> NA It is content aside from the content.
<bdi> NA BDI means Bi-Directional Isolation. It formats the text in different direction.
<datalist> NA It Provides auto complete drop down list.
<details> open It gives more details to user. Where user can view or hide the details.
<dialog> NA It is used to create dialog or windows.
<figcaption> NA This tag gives Caption to <figure> element.
<figure> NA It defines media content with captions.
<footer> NA It defines footer for page or section.
<header> NA This tag gives header to section or document.
<keygen> autofocus, challenge, disabled, form, keytype, name It generates keypair.
<main> NA It specifies main content of the page.
<mark> NA It marks the text with yellow ink.
<menuitem> NA It specifies the command that the user can invoke from a popup menu.
<meter> form, hight, low, max, min, optimum, value Within the predefined range it specifies measurement.
<nav> NA It defines navigation Links.
<progress> form, max, value Progress of any task is defined.
<rp> NA This tag is used to help browsers which don’t support by ruby annotation.
<rt> NA It defines Character pronunciation of ruby annotations.
<ruby> NA It specifies a ruby annotation (used in East Asian typography).
<section> NA It specifies document section.
<summary> NA Defines a visible heading for a <details> element.
<time> datetime It defines a date/time.
<wbr> NA It specifies a line-break opportunity.

Html deprecated tags

The following tags are deprecated(obsolete) in either HTML5 or previous versions.

Tag/Element attribute Description
<acronym> attribute Defines an acronym.
<applet> align, alt, code, codebase Defines the embedded applet.
<basefont> NA Defines font size, color and font family for the document.
<big> NA Defines big text.
<center> NA Defines centered text.
<comment> NA Defines comment in HTML page.
<dir> NA Defines a directory list
<font> color Defines text font, size, and color.
<frame> NA Defines a frame.
<frameset> NA Defines a set of frames.
<isindex> NA Defines a single-line input field.
<menuitem> NA Defines the command that the user can invoke from a popup menu.
<noframes> NA Defines a noframe section.
<s> NA Defines strikethrough text.
<strike> NA Defines strikethrough text.
<tt> NA Defines teletype text.
<u> NA Defines underlined text.
<bgsound> loop Background sound on web pages like audio
<blink> NA Allows elements to blink
<command> checked, disables, icon, radiogroup, type Commands that the user can call or invoke
<content> NA To use content as an insertion point
<element> NA To define DOM element
<keygen> autofocus, challenge, disabled, form, keytype, name automatically generate public keys for submission in form
<listing> NA Listing element. Renders text after the start tag without considering the actual meaning.
<marquee> bgcolor, loop To create scrolling text area.
<multicol> NA To create multi column layout. W3c does not recommend to use this
<nextid> NA Deprecated. To automatically generate name lable as id
<nobr> NA No breaking. Does not allow text to automatically wrap across multiple lines.
<noembed> NA Specifies container for an external application or interactive content into HTML document.
<plaintext> NA Plain Text element. Renders text after the start tag as a plain text without considering the actual meaning.
<shadow> NA To created shadow
<spacer> NA To insert empty space on pages
<xmp> NA Example element. It uses monospaced font & renders text between the start tag and the end tag without translating the actual meaning of HTML.

Tutorials for all brains!