HTML5 Complete Reference
With Examples and Quick Cheat Sheet
Table of Contents
1. Elements Reference
2. Attributes Reference
3. Quick Cheat Sheet
Part 1: Elements Reference
Element Description Example
<p> Paragraph <p>Hello World</p>
<h1>-<h6> Headings <h1>Main</h1>
<a> Hyperlink <a href="[Link]
<img> Image <img src="[Link]" alt="desc">
<ul>/<ol>/<li> Lists <ul><li>Item</li></ul>
<table> Table <table><tr><td>Cell</td></tr></table>
<form> Form <form><input type='text'></form>
<video> Video <video src="movie.mp4" controls></video>
<audio> Audio <audio src="song.mp3" controls></audio>
<header> Page/Section header <header>Header</header>
<footer> Page/Section footer <footer>Footer</footer>
<section> Section of content <section>Content</section>
<article> Independent article <article>Post</article>
<nav> Navigation links <nav><a href='#'>Home</a></nav>
Part 2: Attributes Reference
Attribute Description Example
class Class name(s) <p class="intro">Text</p>
id Unique identifier <div id="main"></div>
src Media/file source <img src="[Link]">
href Link target <a href="[Link]">Link</a>
alt Alt text for images <img src="[Link]" alt="desc">
style Inline CSS styles <p style="color:red">Hi</p>
title Tooltip text <abbr title="World Health Org">WHO</abbr>
target Open link target <a href="[Link]" target="_blank">Open</a>
type Type of input <input type="checkbox">
value Initial value <input type="text" value="Hi">
placeholder Hint text <input placeholder="Enter name">
required Mandatory input <input required>
disabled Disabled element <input disabled>
readonly Read-only input <input readonly>
checked Checked checkbox/radio <input type="checkbox" checked>
Part 3: Quick Cheat Sheet
Concept Example
<!DOCTYPE html>
<html>
<head>
<title>Page</title>
</head>
<body>
...</body>
Basic HTML structure </html>
Link <a href="[Link]
Image <img src="[Link]" alt="desc">
Form input <input type="text" placeholder="Enter name">
Table <table><tr><th>H</th></tr><tr><td>D</td></tr></table>
List <ul><li>Item</li></ul>
