Element Reference
A scannable index of the most important HTML elements, organized by category, each with a one-line description. Use this page to jump straight to "what does this tag do?" without reading a full lesson.
Structural Elements
Element | Description |
|---|---|
<html> | The root element wrapping the entire document |
<head> | Container for document metadata, not rendered visibly |
<body> | Container for all visible page content |
<div> | Generic block-level container with no inherent meaning |
<span> | Generic inline container with no inherent meaning |
<template> | Holds inert markup cloned by JavaScript at runtime |
<slot> | A placeholder inside a web-component template for light-DOM content |
Text Elements
Element | Description |
|---|---|
<h1>–<h6> | Section headings, from most to least important |
<p> | A paragraph of text |
<br> | A single forced line break |
<hr> | A thematic break/divider between sections |
<strong> | Text of strong importance, rendered bold |
<em> | Emphasized text, rendered italic |
<b> | Stylistically bold text with no added importance |
<i> | Stylistically italic text with no added emphasis |
<u> | Text with a non-textual annotation, rendered underlined |
<mark> | Text highlighted for reference or relevance |
<small> | Side comments and fine print |
<s> | Text that is no longer accurate or relevant (strikethrough) |
<del> | Text removed/deleted from a document (tracked edit) |
<ins> | Text inserted into a document (tracked edit) |
<sub> | Subscript text |
<sup> | Superscript text |
<blockquote> | A block-level quotation, optionally with cite |
<q> | A short, inline quotation |
<cite> | The title of a referenced work |
<abbr> | An abbreviation or acronym, with a title tooltip |
<dfn> | Marks the defining instance of a term |
<code> | A short fragment of inline computer code |
<pre> | Preformatted text, preserving whitespace and line breaks |
<kbd> | Keyboard or other user input |
<samp> | Sample output from a program |
<var> | A variable name in code or math |
<bdo> | Overrides the bidirectional text algorithm explicitly |
<bdi> | Isolates text that might have a different directionality |
<wbr> | A suggested word-break opportunity |
Lists
Element | Description |
|---|---|
<ul> | An unordered (bulleted) list |
<ol> | An ordered (numbered) list |
<li> | A single item within a list |
<dl> | A description (definition) list |
<dt> | A term within a description list |
<dd> | A term's description within a description list |
Links & Navigation
Element | Description |
|---|---|
<a> | A hyperlink to another resource, page, or in-page anchor |
<nav> | A section containing primary navigation links |
<link> | Links an external resource to the document (usually in <head>) |
<map> | A client-side image map's container |
<area> | A clickable region within an image map |
Forms
Element | Description |
|---|---|
<form> | A container for interactive controls, with submission behavior |
<label> | A caption bound to a specific form control |
<input> | A single form control; behavior varies widely by type |
<textarea> | A resizable, multi-line text input |
<button> | A clickable control, typically inside or tied to a form |
<select> | A dropdown control offering a list of options |
<option> | A single choice inside a <select> or <datalist> |
<optgroup> | Groups related <option> elements under a shared label |
<datalist> | A list of suggested autocomplete values for an input |
<fieldset> | Groups related form controls together |
<legend> | A caption for the enclosing <fieldset> |
<output> | Displays the result of a calculation or user action |
<progress> | A task's completion progress |
<meter> | A scalar value within a known range (e.g. disk usage) |
Media
Element | Description |
|---|---|
<img> | Embeds a single image |
<picture> | Wraps multiple <source> elements for responsive art direction |
<source> | A media resource alternative inside <picture>, <video>, or <audio> |
<figure> | Self-contained media content, referenced from the main flow |
<figcaption> | A <figure>'s caption |
<audio> | Embeds sound content with native playback controls |
<video> | Embeds video content with native playback controls |
<track> | Adds captions/subtitles to <audio>/<video> |
<canvas> | A bitmap drawing surface controlled via JavaScript |
<svg> | An inline scalable vector graphic |
<embed> | Embeds external content via a browser plugin |
<object> | Embeds an external resource (PDF, media, or another HTML page) |
<iframe> | Embeds another HTML document inline |
Tables
Element | Description |
|---|---|
<table> | The container for tabular data |
<caption> | A table's title, announced before its content |
<thead> | The table's header row group |
<tbody> | The table's main body row group |
<tfoot> | The table's footer row group |
<tr> | A single table row |
<th> | A header cell, associated with a row or column via scope |
<td> | A standard data cell |
<colgroup> | Groups columns for shared styling |
<col> | A single column within a <colgroup> |
Semantic HTML5 Elements
Element | Description |
|---|---|
<header> | Introductory content for its nearest sectioning ancestor |
<footer> | Footer content for its nearest sectioning ancestor |
<main> | The unique primary content of the document |
<section> | A generic, themed content grouping, usually with a heading |
<article> | Self-contained content reusable/syndicatable on its own |
<aside> | Content tangential to the surrounding main content |
<details> | A native, user-togglable disclosure widget |
<summary> | A <details> widget's always-visible summary/label |
<dialog> | A native modal or non-modal dialog box |
<time> | A human-readable date/time with a machine-readable equivalent |
<address> | Contact information for the nearest article or the whole page |