HTML5 Cheat Sheet image
Posted on 15 Apr 2016

HTML5 Cheat Sheet

This is a simple HTML5 tags cheat sheet. It's created for students interested in attending Training Dragon's web design course or Advanced HTML5 course. The first column is for the HTML5 tag, second column is a quick explanation of the tag and the last column list attributes of html5 tags. If you would like to suggest any improvements to this, please leave a comments below.

 

Tag
Explanation
Attributes

<!-- bla bla -->

comment

 

<!DOCTYPE>

document type

 

<a>

anchor or hyperlink

href, hreflang, media, ping, rel, target, type

<abbr>

abbreviation

 

<address>

address

 

<area>

area inside an image map

alt, coords, href, hreflang, media, ping, rel, shape, target, type

<article>

article

cite, pubdate

<aside>

content aside from the page content

 

<audio>

sound content

autobuffer, autoplay, controls, src

<b>

bold text

 

<base>

base URL for all the links in a page

href, target

<bdo>

direction of text display

dir

<blockquote>

long quotation

cite

<body>

body of the page

 

<br>

line break

 

<button>

button

autofocus, disabled, form, formaction,
formenctype, formmethod, formnovalidate, formtarget, name, type, value

<canvas>

graphics

height, width

<caption>

table caption

 

<cite>

citation

 

<code>

code text

autobuffer, autoplay, controls, src

<col>

table column

 

<colgroup>

group of table columns

span

<command>

command button

checked, disabled, icon, label, radiogroup, type

<datalist>

dropdown list

 

<dd>

definition description

 

<del>

deleted text

cite, datatime

<details>

details of an element

open

<dialog>

dialog or conversation

 

<dfn>

definition term

 

<div>

section in a document

 

<dl>

definition list

 

<dt>

definition term

 

<em>

emphasized text

 

<embed>

external interative content

height, src, type, width

<fieldset>

fieldset

disabled, form, name

<figure>

group of media content and caption

 

<footer>

footer of page

 

<form>

form

accept-charset, action, autocomplete, enctype, method, name, novalidate, target

<frame>

frame within a frameset

 

<h1> to <h6>

heading 1 to heading 6

 

<head>

information about the document

 

<header>

header of a page

 

<hgroup>

information about section in a document

 

<hr>

horizontal rule

 

<html>

html document

 

<i>

italic text

 

<iframe>

an inline sub window

height, name, sandbox, seamless, src, width

<img>

image

alt, src, height, ismap, usemap, width

<input>

input field

accept, alt, autocomplete, autofocus,
checked, disabled, form, formaction, formenctype,
formmethod, formnovalidate, formtarget,
height, list, max, maxlegth, min, multiple,
name, pattern, placeholder, readonly,
required, size, src, step, type, value, width

<ins>

inserted text

cite, datetime

<keygen>

generated key in a form

autofocus, challenge, disabled, form, keytype, name

<kbd>

keyboard text

 

<label>

caption for an item

for, form

<legend>

title in a fieldset

 

<li>

list item

value

<link>

resource refrence

href, hreflang, media, rel, size, type

<map>

image map

name

<mark>

marked text

 

<menu>

menu list

label, type

<meta>

meta information

charset, content, http-equiv, name

<meter>

measurement within a predefined range

high, low, max, min, optimum, value

<nav>

navigation links

 

<noscript>

embedded object

data, form, height, name, type, usemap, width

<ol>

ordered list

reversed, start

<optgroup>

option group

label, disabled

<option>

option in a drop-down list

disabled, label, selected, value

<output>

type of output

for, form, name

<p>

paragraph

 

<param>

parameter for an object

name, value

<pre>

preformatted text

 

<progress>

progress of a task

max, value

<q>

short quotation

cite

<rp>

fall-back parenthesis for browsers non-supporting ruby annotations

 

<rt>

explanation to ruby annotations

 

<ruby>

ruby annotations

 

<samp>

sample computer code

 

<script>

script within document

async, type, charset, defer, src

<section>

section

cite

<select>

selectable list

autofocus, disabled, form, multiple, name, size

<small>

samll text

 

<source>

media resources

media, src, type

<span>

section in document

 

<strong>

strong text

 

<style>

style within document

type, media, scoped

<sub>

super-scripted text

 

<sup>

sub-scripted text

 

<table>

table

summary

<tbody>

table body

summary

<td>

table data or table cell

colspan, headers, rowspan

<textarea>

text area

autofocus, cols, disabled, form,
maxlenght, name, placeholder, readonly, required, rows, wrap

<tfoot>

table footer

 

<thead>

table head

 

<th>

table header

colspan, headers, rowspan, scope

<time>

date and time

datetime

<title>

title of document

 

<tr>

table row

 

<ul>

unordered list

 

<var>

variable

 

<video>

video

autobuffer, autoplay, controls, height, loop, src, width