HTML Quick Reference Chart for Beginners

This HTML quick reference guide is designed to provide basic references to commonly used HTML elements. As with all things technical, HTML changes with new releases and some of these items may be discontinued (eliminated) or deprecated (replaced) over time; however, many of these changes are purely academic.

Download a printable version of this HTML Quick Reference Guide

HTML Structure Tags

<html> xxx </html> Encloses the entire HTML Document
<head> xxx </head> Encloses the head of the HTML Document
<body> xxx </body> Encloses the Body (Text and Tags) of the HTML Document
<!– xxx –> Comment – only visible in HTML, used to identify sections of code or for keywords
<HR /> Horizontal Rule

*Note – any HTML element (Horizontal Rule, Image, etc.) that doesn’t have an open and a close requires the backslash before the closing carot (greater than).

HTML Headings

<H1> xxx </H1> Headings 1 through 6
<H2> xxx </H2>
<H3> xxx </H3>
<H4> xxx </H4>
<H5> xxx </H5>
<H6> xxx </H6>

Paragraphs and Sentence Formatting

<P> xxx </P> A Plain paragraph
<BR /> A line break
<BLOCKQUOTE> xxx </BLOCKQUOTE> Indent/Quote

Hyperlinks

<A> xxx </A> Creates a link or anchor

HREF=”xxx” The URL of the document
NAME=”xxx” The name of the anchor
TARGET=”xxx” The action the browser is to take when opening a link; options are:

_self = Same Frame
_top = Whole Page
_blank = New Window
_parent = Parent Frame

Lists and Outlines

<OL> xxx </OL> Ordered (Numbered) List
<UL> xxx </UL> Unordered (Bulleted) List

<LI> xxx </LI> A List Item

Type = Formatting style
1 = Arabic Numbers 1,2,3,…
a = Lower Alpha a, b, c, …
A = Upper Alpha A, B, C, …
i = lower roman i, ii, iii, …
I = upper roman I, II, III, …

HTML Tables

<Table> xxx </Table> Creates a table

Border=”xxx” Size of border in pixels, 0 if not to be visible in the document
ALIGN=”xxx” Position of table in the document
Width=”xxx” Width of the table in document determined by pixels or percentage
Height=”xxx” Height of table in document, determined by pixels or percentage

<Caption> xxx </Caption> The caption for the table

ALIGN=”xxx” Horizontal alignment of caption

<TR> xxx </TR> A table row

ALIGN=”xxx” Horizontal alignment of cell contents
VALIGN=”xxx” Vertical alignment of cell contents

<TH> xxx </TH> A Table Heading Cell

ALIGN=”xxx” Horizontal alignment of cell contents
VALIGN=”xxx” Vertical alignment of cell contents
RowSpan=”xxx” Number of rows the cell crosses/spans
ColSpan=”xxx” Number of columns the cell crosses/spans
Nowrap Prevents contents of cell from wrapping

<TD> xxx </TD> Defines a table data cell

Images

<IMG /> Insert an image into the document

SRC=”xxx” The URL or path of the image
ALT=”xxx” Alternate text to display for browsers that can’t display images, or Accessibility enabled systems
ALIGN=”xxx” Position of image to surrounding text in the document
VSPACE=”xxx” Vertical space
HSPACE=”xxx” Horizontal Space
Border=”xxx” Border around the image
Ttitle=”xxx” Name of the image

Character Formatting

<font> xxx </font> Defines font attributes

Color=”xxx” Defines font color
Font Family=” xxx” Defines font family / type
size=”xxx” defines the size of the font
pt – defines size in standard point size
px – defines size in pixels 13
<EM> xxx </EM> Emphasis
<Strong> xxx </Strong> Stronger Emphasis
<B> xxx </B> Boldface Text
<I> xxx </I> Italic Text
<U> xxx </U> Underline
<strike> xxx </strike> Strikethrough
<sup> xxx </sup> Superscript
<sub> xxx </sub> Subscript

Special Characters

© creates a copyright symbol – ©
® creates a registration mark symbol – ®
™ creates a trade mark symbol – TM
— creates the longer dash used in publishing —

Common CSS Attributes

<Span> xxx </span> Defines area to apply CSS

Style=”xxx” Allows for formatting of font and positioning using CSS

<Div> xxx </Div> Defines area to apply CSS