HTML Cheatsheet
HTML is the backbone of every web page. This cheatsheet covers the essential tags for structure, forms, media, and semantics.
HTML (HyperText Markup Language) structures the content of web pages. This cheatsheet covers the essential tags and attributes.
Document Structure
The skeleton of every page.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<title>Page Title</title>
</head>
<body></body>
</html>
Text Elements
Headings and paragraphs.
<h1>Main heading</h1>
<h2>Subheading</h2>
<p>A paragraph of text.</p>
<strong>bold</strong> <em>italic</em>
<br /> <hr />
Links & Images
Navigate and display media.
<a href="https://example.com" target="_blank">Link</a>
<img src="photo.jpg" alt="Description" width="400" />
Lists
Ordered and unordered.
<ul>
<li>Item</li>
</ul>
<ol>
<li>First</li>
</ol>
Semantic Layout
Meaningful structure.
<header></header>
<nav></nav>
<main>
<article></article>
<section></section>
<aside></aside>
</main>
<footer></footer>
Forms
Collect user input.
<form action="/submit" method="post">
<label for="email">Email</label>
<input type="email" id="email" name="email" required />
<textarea name="message"></textarea>
<select name="plan">
<option value="free">Free</option>
</select>
<button type="submit">Send</button>
</form>
Tables
Display tabular data.
<table>
<thead>
<tr><th>Name</th><th>Age</th></tr>
</thead>
<tbody>
<tr><td>Ada</td><td>36</td></tr>
</tbody>
</table>
Media
Audio and video.
<video src="clip.mp4" controls></video>
<audio src="song.mp3" controls></audio>
HTML is the foundation of the web. Use semantic tags for accessibility and SEO, then layer on CSS for style and JavaScript for interactivity.
For full documentation, see https://developer.mozilla.org/en-US/docs/Web/HTML