HTML Tag List
Complete reference of all HTML tags with examples
🏷️ HTML Tags Overview
HTML tags are the building blocks of web pages. Each tag serves a specific purpose and helps structure content in a meaningful way.
<!-- Basic HTML structure -->
<html>
<head>
<title>Page Title</title>
</head>
<body>
<h1>Main Heading</h1>
<p>Paragraph text</p>
</body>
</html>
Document Structure Tags
<html>
Root element of HTML document
<html lang="en">
<!-- All content goes here -->
</html><head>
Contains metadata about the document
<head>
<title>Page Title</title>
<meta charset="UTF-8">
</head><body>
Contains visible page content
<body>
<h1>Welcome!</h1>
<p>Content here</p>
</body><title>
Sets the page title in browser tab
<title>My Website</title>🔹 Text Content Tags
Tags for organizing and formatting text content:
<!-- Headings -->
<h1>Main Heading</h1>
<h2>Sub Heading</h2>
<h3>Section Heading</h3>
<!-- Paragraphs and text -->
<p>This is a paragraph.</p>
<span>Inline text</span>
<div>Block container</div>
<!-- Text formatting -->
<strong>Bold text</strong>
<em>Italic text</em>
<mark>Highlighted text</mark>Output:
Main Heading
Sub Heading
Section Heading
This is a paragraph.
Inline text
Block container
Bold text
Italic text
Highlighted text
🔹 List Tags
Create organized lists of content:
<!-- Unordered list -->
<ul>
<li>First item</li>
<li>Second item</li>
</ul>
<!-- Ordered list -->
<ol>
<li>Step one</li>
<li>Step two</li>
</ol>
<!-- Description list -->
<dl>
<dt>HTML</dt>
<dd>Markup language</dd>
</dl>Output:
- First item
- Second item
- Step one
- Step two
- HTML
- Markup language
🔹 Link and Media Tags
Connect pages and embed media content:
<!-- Links -->
<a href="https://example.com">External link</a>
<a href="#section">Internal link</a>
<!-- Images -->
<img src="image.jpg" alt="Description">
<!-- Audio and Video -->
<audio controls>
<source src="audio.mp3" type="audio/mpeg">
</audio>
<video controls width="300">
<source src="video.mp4" type="video/mp4">
</video>