HTML Reference

Essential HTML tags for beginners and web developers.

Document Structure

<html>

Main HTML document.

<html></html>

<head>

Contains page settings.

<head></head>

<body>

Visible webpage content.

<body>Hello</body>

<title>

Browser tab title.

<title>My Site</title>

<meta>

Page metadata.

<meta charset="UTF-8">

<link>

Links external files.

<link rel="stylesheet">

<style>

Internal CSS styles.

<style>
body{color:red;}
</style>

<script>

Adds JavaScript.

<script>
alert("Hi");
</script>

Text & Typography

<h1>

Main heading.

<h1>Heading</h1>

<h2>

Secondary heading.

<h2>Heading</h2>

<p>

Paragraph text.

<p>Hello world</p>

<strong>

Bold important text.

<strong>Bold</strong>

<em>

Italic emphasis.

<em>Italic</em>

<small>

Small text.

<small>Small</small>

<mark>

Highlighted text.

<mark>Highlight</mark>

<blockquote>

Quoted section.

<blockquote>Quote</blockquote>

<code>

Code text.

<code>print()</code>

<pre>

Preformatted text.

<pre>
Line 1
Line 2
</pre>

<br>

Line break.

Hello<br>World

<hr>

Horizontal line.

<hr>

Links & Media

<a>

Clickable link.

<a href="#">Link</a>

<img>

Displays image.

<img src="photo.jpg">

<video>

Embeds video.

<video controls></video>

<audio>

Embeds audio.

<audio controls></audio>

<source>

Media source file.

<source src="movie.mp4">

<iframe>

Embeds webpage.

<iframe src="site.com"></iframe>

<canvas>

Drawing area.

<canvas></canvas>

<svg>

Vector graphics.

<svg></svg>

Layout & Semantic HTML

<div>

Layout container.

<div>Content</div>

<span>

Inline container.

<span>Text</span>

<header>

Top page section.

<header></header>

<nav>

Navigation links.

<nav></nav>

<main>

Main content area.

<main></main>

<section>

Content section.

<section></section>

<article>

Independent content.

<article></article>

<aside>

Sidebar content.

<aside></aside>

<footer>

Bottom page section.

<footer></footer>

Lists

<ul>

Unordered list.

<ul></ul>

<ol>

Ordered list.

<ol></ol>

<li>

List item.

<li>Item</li>

<dl>

Description list.

<dl></dl>

<dt>

Description term.

<dt>Word</dt>

<dd>

Description details.

<dd>Definition</dd>

Tables

<table>

Creates table.

<table></table>

<tr>

Table row.

<tr></tr>

<td>

Table data cell.

<td>Data</td>

<th>

Table heading cell.

<th>Title</th>

<thead>

Table header.

<thead></thead>

<tbody>

Table body.

<tbody></tbody>

<tfoot>

Table footer.

<tfoot></tfoot>

Forms

<form>

Creates form.

<form></form>

<input>

User input field.

<input type="text">

<textarea>

Multi-line input.

<textarea></textarea>

<select>

Dropdown menu.

<select></select>

<option>

Dropdown item.

<option>Choice</option>

<label>

Input label.

<label>Name</label>

<button>

Clickable button.

<button>Submit</button>

<fieldset>

Groups form fields.

<fieldset></fieldset>

<legend>

Fieldset title.

<legend>Info</legend>

Interactive Elements

<details>

Expandable content.

<details></details>

<summary>

Details title.

<summary>Open</summary>

<dialog>

Popup dialog box.

<dialog></dialog>

<progress>

Progress bar.

<progress value="50" max="100"></progress>