HTML Cheat Sheet

Use this HTML cheat sheet to quickly find the code you need. All you need to do is copy (from this cheat sheet) and paste into your website's code. If need be, you can change the values to suit your particular situation.

Description Code Result

Text

Headings

Heading 1

Heading 2

Heading 3

Heading 4

Heading 5

Heading 6

Paragraphs

Normal paragraph text.

Line Break I feel a line break coming... <br /> ...up. I feel a line break coming...
...up.

Bold Text <b>Bold text.</b> Bold text.

Italic Text <i>Italic text.</i> Italic text.

Color Text

Color text.

Text Size

Text size using points.

Text size using pixels.

Text size using relative sizes.

Font Family

Preferred serif font.

Preformatted Text

Preformatted text displays just as you type it...
		...line breaks, spaces and all!

Teletype Text <tt>Teletype text - sometimes referred to as typewriter text.</tt> Teletype text - sometimes referred to as typewriter text.

Citation Text <cite>Citation text.</cite> Citation text.

Emphasized Text <em>Emphasized text.</em> Emphasized text.

Code Text <code>Code text.</code> Code text.

Big Text <big>Big text.</big> Big text.

Small Text <small>Small text.</small> Small text.

Blockquote

The label says:

Contents should not be swallowed. This is due to the enormous amount of harmful chemicals that has gone into this burger.

Deleted Text <del>Delete this text.</del> ~~Delete this text.~~

Inserted Text <ins>Insert this text.</ins> Insert this text.

Keyboard Text <kbd>Keyboard text - text to be entered by the user.</kbd> Keyboard text - text to be entered by the user.

Quotation Text <q>Quotation text.</q> Quotation text.

Sample Text <samp>Sample text (output from a computer program).</samp> Sample text (output from a computer program).

Variable Text <var>Variable text.</var> Variable text.

Definition <dfn>Definition.</dfn>: To define the meaning of a word, phrase or term. Definition.: To define the meaning of a word, phrase or term.

Images

Image <img src="/pix/milford_sound/milford_sound_t.jpg" width="225" height="151" alt="Milford Sound in New Zealand" />

Image with Border <img src="/pix/milford_sound/milford_sound_t.jpg" width="225" height="151" alt="Milford Sound in New Zealand" border="5" />

Linked Image <a href="http://www.quackit.com/travel/new_zealand/milford_sound"><img src="/pix/milford_sound/milford_sound_t.jpg" width="225" height="151" alt="Milford Sound in New Zealand" /></a>

Linked Image with no Border <a href="http://www.quackit.com/travel/new_zealand/milford_sound"><img src="/pix/milford_sound/milford_sound_t.jpg" width="225" height="151" alt="Milford Sound in New Zealand" border="0" /></a>

Tables

Basic Table

Table cell 1

Table cell 2

Table with cellpadding, cellspacing, and width attributes

Table cell 1

Table cell 2

Table with a Header Row

Table header	Table header
Table cell 1	Table cell 2

Table with colspan Applied

Table header
Table cell 1	Table cell 2

Table with rowspan Applied

Table header	Table cell 1
Table header	Table cell 2

Table with CSS Applied

Table header	Table header
Table cell 1	Table cell 2

Forms

Basic Form Tags (insert all form elements between these tags)

Text Input <input type="text" size="30" value="Type something..." />

Text Area <textarea cols="10" rows="5">Type something</textarea> Type something

Radio Buttons <input type="radio" name="cheat_sheet_example" value="Option1" /> Option 1 <input type="radio" name="cheat_sheet_example" value="Option2" /> Option 2 Option 1 Option 2

Checkboxes <input type="checkbox" name="cheat_sheet_example" value="Option1" /> Option 1 <input type="checkbox" name="cheat_sheet_example" value="Option2" /> Option 2 Option 1 Option 2

Select List <select name="cheat_sheet_example"><option value="Option1">Option 1<option value="Option2">Option 2<option value="Option3">Option 3</select>

Submit Button <input type="submit" value="Send Away!" />

Image Button <input type="image" src="/pix/smile.gif" />

Lists

Ordered list (numbered list)

List item 1
List item 2
List item 3

Unordered list (unnumbered list)

List item 1
List item 2
List item 3

Definition list

Term 1: Definition of term 1
Term 2: Definition of term 2

Frames

Inline Frame <iframe src="/pix/milford_sound/milford_sound_t.jpg" width="200" height="150" scrolling="auto" frameborder="1">  Your browser doesn't support inline frames. </iframe>  Your browser doesn't support inline frames.

Frames

The frameset (frame_example_frameset_1.html):

The left frame (frame_example_left.html):

The right frame (frame_example_right.html):

View the result

HTML

HTML Cheat Sheet

Heading 1

Heading 2

Heading 3

Heading 4

Heading 5

Heading 6

Enjoy this website?

ABOUT

HTML/MARKUP

CSS & DESIGN

SCRIPTING

DATABASE

WEB HOSTING