HTML: List of HTML Tags

By Xah Lee. Date: . Last updated: .

This page is a complete list of HTML tags.

Html structure

DOCTYPE
  • DOCTYPE delaration.
  • This must be the first line.
html
  • Wrapper tag for entire file. (only DOCTYPE goes before it.)
  • This is called the root element.
head

Wrapper tag for meta info

body
  • Wrapper tag for page content.
  • Must be used right after the head element.

Meta info tags inside head tag

meta
  • Meta info.
  • Must be inside head tag.
  • Used for charset declaration, language declaration, and viewport, etc.
<meta charset="utf-8" />
link

For link to css file and others.

Must be inside head tag.

<link rel="stylesheet" href="my.css" />
title
  • Document title.
  • Most important. Every page must have this.
  • Must be inside head tag.
base
  • Base URL.
  • Rarely used.
  • Must be inside head tag.
<base href="http://example.com/" />

Css

style

for adding in-page or in-element CSS style rules.

<style>
.x {
 color: red;
}
</style>

Javascript

script

Embed JavaScript code.

noscript
  • used when browsers may not support JavaScript, or user have JavaScript turned off.
  • not much used since about 2015, because most sites assume JavaScript.
<noscript>please turn on JavaScript for the site to work.</noscript>

Div and span

these are special, generic, no semantic meaning.

div

Generic block markup.

Usually used for CSS and JavaScript scripting purposes.

span

Generic inline style markup, usually for text.

Usually used for CSS style purposes.

Page structure

nav

Navigation bar or panel. usually outside of main tag.

header

Page's header

footer

Page's footer

aside

Tangentially related content (sidebar, pull-quote, related links, ads).

main, article, section

main

the main content of the page.

Each page should have just one main.

Inside, it may contain article, aside, section.

Content that is repeated across pages (site nav, logos, copyright) generally does not belong inside main.

article

Self-contained, independently distributable content (blog post, news story, comment, widget).

section

Thematic grouping of content, usually with a heading.

Title/section heading

h1, h2, h3, h4, h5, h6

Heading of different levels.

h1 to h3 are very common.

usually, main, article, section have at least one heading.

Text block

p

Paragraph

pre

usually for code, poem, lyrics.

by default it uses monospaced font and respect line-breaks.

List

ul, ol, li
dl, dt, dd
menu

same as ul. old baggage. not much used.

Link (anchor)

a

Link (known as anchor)

example: 

<a href="html5_tags.html">HTML: List of HTML Tags</a>

Table

table, tr, td, th, caption, thead, tfoot, tbody, colgroup, col

Image

img

Inline image.

picture

Inline image with multiple versions.

Figure and figcaption

figure, figcaption

Image map

map, area

Audio, video

video, audio, source, track

Other special objects

canvas

Interactive graphics, games.

iframe

Embed a page; inner window.

object, param

Embedded object.

embed

Interactive content or plugin

Misc

dfn

example: definition term

used to indicate the defining instance of a term. It marks the first occurrence of a word or phrase that is being defined in the surrounding context.

abbr

for abbreviation.

example: i18n

<abbr title="Internationalization">i18n</abbr>
address

Markup for contact of article or page.

time

Text semantic markup

strong

example: important.

em

example: emphasize.

del

example: deleted text

ins

example: newly inserted text (in contrast to del)

mark

example: highlight

small

example: smaller

Text decoration

b

example: bold

i

example: italic

u

example: underline

for book title, misspelled word, etc.

s

example: strike-thru

Computer code related

code

example: computer code

var

example: variable

samp

example: sample code.

Used to show computer output. e.g. error messages or console output.

for dynamic JavaScript generated content, prefer the output tag.

kbd

example: a b c 1 2 3.

Used to show computer keystroks.

sup

example: superscript

sub

example: subscript

Citation and quotes

blockquote

Quote passages, excerpt. may contain p tag or others.

q

example: short inline quote

cite

example: book title

any sort of title, such as for book, article, essay, song, script, film, TV show, game, artwork, etc.

not for author name or full citation. for quoting passage, use blockquote.

Line break

hr

Horizontal rule (draw a horizontal line)

br

Line break

wbr
  • Line-break hint.
  • Browsers can render line break at this point.

Text direction

bdi, bdo

Form and input related tags

form, input, button, textarea, select, option, optgroup, label, fieldset, legend, datalist, menu

Output related

output

used as a container for JavaScript generated result.

meter

percentage indicator.

progress

Collapsible box

details, summary

Ruby. pronunciation markup for asian languages.

ruby rt rp

Obsolete html 5 tags

command

? Creating a user input, such as buttons.

keygen

Generate a encryption key.

Html 4 tags obsolete in html 5

acronym

Use abbr

applet

Use embed or object.

bgsound

Use HTML: Audio Tag

basefont

Use CSS: font-family instead.

big

Use CSS: font-size instead.

center
dir
  • Directory list.
  • Use ul
font

Use CSS font-family

frame

Use HTML: iframe.

frameset

HTML 5 does not support anything similar.

noframes

Used with frameset.

strike

Use s.

tt
  • Stands for “teletype”, rendered in monospace font.
  • Use code or samp tag instead, or use CSS: font-family.
xmp

Use pre with CSS.