HTML Quick Reference

 Reference

? = in pixels

= percent of screen ... = text

 Basic Elements

Document Type

<!doctype...> Specifies the document type

Document

<HTML></HTML> Begins and ends every HTML document

Document Head

<HEAD></HEAD> Contains all elements of the document heading. Meta tags, scripts,ect.

Document Title

<TITLE></TITLE> Must be inside the document head. Will show on the title bar of thebrowser.

Document Body

<BODY><BODY> Include all document data and coding in this container.

 Document Formatting

Blinking Text

<BLINK> </BLINK> Use in moderation. Is not supported by some older browser versions

Center

<CENTER> </CENTER> Centers all data inside the container.

Citation

<CITE></CITE> Indents the text. Usually in italics

Headings

<H?> </H?>
H1|2|3|4|5|6
H? COLOR="#rrggbb"
H? ALIGN=left|center|right
Paragraph and page titles. Sizes are 1-6. 1 being largest

Horizonal Rule

<HR>
Attributes:
HR ALIGN=left|center|right
HR NOSHADE
HR WIDTH="%|?"
HR SIZE="?"
Creates a horizonal line. Does not use an end tag.

Line Break

<BR> Forces text to the next line

Keep text together

<NOBR> </NOBR> Prevents word wrap

Paragraph

<P>Attributes:
P ALIGN=left|center|right
Does not need a closing tag. Used alone will create a double spacebetween paragraphs. According to W3C empty paragraph elements should be ignored

Preformatted Text

<PRE> </PRE> Displays text as-is.

Quote

<BLOCKQUOTE> </BLOCKQUOTE> Double indents text 5 spaces

 Text Fomatting

Base Font

<BASE FONT SIZE="?"> Sizes are 1-7, default size is 3

Bold

<B> </B>

Empasize

<EM> </EM> Same as Italics

Font Color

<FONT COLOR="#rrggbb|color"> RGB hex number or color name.

Font type

<FONT FACE="Font name"> </FONT> Font must be installed on the idividual computer

Font size

<FONT SIZE="?"> </FONT> In points -7 to +7

Italics

<I> </I>

Large Font

<BIG> </BIG>

Small Font

<SMALL> </SMALL>

Spacer

<SPACER>
Attributes:
SPACER TYPE=horizonal|vertical|block

Span

<SPAN></SPAN> Used to hold formatting attributes such as style sheets

Strikeout

<S> </S>
<STRIKE> </STRIKE>
Strikeout

Strong

<STRONG> </STRONG> Same as bold

Subscript

<SUB> </SUB> This is subscript

Superscript

<SUP> </SUP> This is superscript

Typewritter

<TT> </TT> Typerwritter

Underline

<U> </U> Underline

 Links

Basic Link

<A HREF="http://URL/">(outside)
<A HREF="page.html">(inside)
Links to any URL outside your web site or inside your domain

E-mail

<A HREF="mailto:you@domain.com">

Target

<A HREF="page.html#targetname">(inside)
<A HREF="http://url/page.html#targetname">
Used with <A NAME="targetname">

Target name

<A NAME="targetname"> Used to target links inside the document

Target Window

<A HREF="url" TARGET="windowname|_self|_parent|_top|_blank"> Used to target specified browser window

 Graphics

Image

<IMAGE SRC="file.ext"> Displays an image withing the document.

<IMAGE SRC="http://url/file.ext"> Calls the image from a url outside your domain

<IMAGE SRC="directory/file.ext"> Calls the image from a directory inside your domain.

Image attributes
Used inside the IMAGE tag

HEIGHT=? WIDTH=? Specifies the height and width of the image.

BORDER=? Specifies the border width of the image in pixels

HSPACE=? Specifies the horizonal space left and right of the image in pixels

VSPACE=? Specifies the vertical space above and below the image in pixels

LOWSRC="file.ext" Used to insert a smaller file size image beneath the image

Image Map

<IMG SRC="file.ext" ISMAP>(server side)
<IMG SRC="file.ext" USEMAP"mapname">(client side)
Requires use of map script for server side image maps

Map Description

<MAP NAME="mapname">

Map Specifications

<AREA SHAPE="rect|circle" COORDS="?,?,?,?" HREF="url|nohref"> Client side. Requires the pixel coordinates of the image

Objects

<EMBED SRC="file.ext"> Embeds a file into the document. Widely used for audio and video images

 List

Ordered list

<OL> </OL> Use for numbered lists. Uses <LI> for list items

Un ordered List

<UL> </UL> Use for bulleted lists. Uses <LI> for list items

List Item

<LI> List data, used before each item of the list

Bulleted Types

<UL TYPE=circle|disc|square">(entire list)
<LI TYPE="circle|disc|square">(subsequent)
Specifies the type of bullet

Number Types

<OL TYPE="A|a|I|i|1">(entire list)
<LI TYPE="A|a|I|i|1">(subsequent)
Specifies the type of numbering

Number Start

<OL START="?">(entire list)
<LI START="?">(subsequent)

Definition List

<DL> </DL> Uses <DT> for definition terms

Definition Term

<DT> </DT> Defines the definition term

Definition Data

<DD> </DD> Defines the definition data

Menu List

<MENU> </MENU> Use <LI> for menu items

Directory List

<DIR> </DIR> Use <LI> for directory items

 Background & Color

Background Image

BACKGROUND="file.ext"(used inside the BODY tag) Inserts an image in the background of the document

Background Color

BGCOLOR="#RRGGBB|colorname"(used inside the BODY tag) Specifies the color of the background of the document. ClickHere for a short list of colors and coordinating hexidecimal numbers.

Link Color

LINK="#RRGGBB|colorname"(used inside the BODY tag) Specifies the unvisited link color throughout the document.

Visited link color

VLINK="#RRGGBB|colorname"(used inside the BODY tag) Specifies the visited link color throughout the document.

Active link color

ALINK="#RRGGBB|colorname"(used inside the BODY tag) Specifies the active link color throughout the document.

 Forms

Form Specification

<FORM> </FORM>

Form Action

ACTION="cgi-bin/file.cgi"(used inside the FORM tag) Requires the use of a CGI script

Form Method

METHOD="post|get" (used inside the FORM tag)

I nput Field

<INPUT TYPE="text|radio|checkbox|password|hidden|submit|reset|image"
Attributes:
NAME="fieldname"
SIZE="?"
MAXLENGHT="?"(in characters)
value="..."
User data input. NAME= is required.

Selection Drop Down Menu

<SELECT NAME="fieldname"> </SELECT>
Attributes:
SIZE=?(number of options)
MULTIPLE(more than one option can be selected)
Name is required

Selection Menu Items

<OPTION VALUE="...">...(used inside the SELECT container)

Text Box

<TEXTAREA NAME="fieldname"> </TEXTAREA>
Attributes:
COLS=?
ROWS=?
WRAP="true|off|virtual|physical"
MAXLENGTH=?
End tag is required.

 Tables

Table Specification

<TABLE> </TABLE>
Attributes:
WIDTH="%|?"
ALIGN="left|center|right"
CELLSPACING=?
CELLPADDING=?
BGCOLOR="#RRGGBB|colorname"
BACKGROUND="file.ext"
BORDER=?
BORDERCOLOR="#RRGGBB|colorname"
Defines and formats the table

Table Row

<TR> </TR>
Attributes:
ALIGN="left|center|right"
VALIGN="top|middle|bottom"
BGCOLOR="#RRGGBB|colorname"
BACKGROUND="file.ext"
Required

Table Data

<TD> </TD>
Attributes:
ALIGN="left|center|right"
VALIGN="top|middle|bottom"
BGCOLOR="#RRGGBB|colorname"
NOWRAP
Required. All visible elements go in this container.

Column Span

<TD COLSPAN="?"> (number of cells to span)

Row Span

<TD ROWSPAN="?">(number of rows to span

Table Heading

<TH></TH>
Attributes:
BGCOLOR="#RRGGBB|colorname
ALIGN="left|center|right"
VALIGN="top|middle|bottom"
Bolds and centers all text inside the container

Table Captioin

<CAPTION></CAPTION>
Attributes:
ALIGN="top|bottom"

  Frames

Frame Document

<FRAMESET> </FRAMESET> Used without <HTML> tags

Frame Rows

<FRAMESET ROWS="%,*|?,?"> </FRAMESET * = relative size

Frame Columns

<FRAMESET COLS="%,*|?,?"> </FRAMESET

Document Frame

<FRAME SRC="url|file.ext"> Specifies what document is to be displayed in the frame window

Frame Name

<FRAMESET NAME="windowname"> Each frame windodw must be named

No Frames

<NOFRAMES> </NOFRAMES> Allows non-frames capable browsers to read the document.

 Miscellaneous

Comment

<!-- ... --> Places hidden comments in the source of the document.

Base URL

<BASE HREF="url of page"
Attributes:TARGET="_top|_parent|_self|_blank|..."
Must be placed before the <HTML> start tag.

Meta

<META>
Attributes:
NAME="description|keywords|revisit after|rating|distribution|author"
CONTENT="..."
HTTP-EQUIV=" "
Meta tags are used primarily for search engine indexing. These mustbe placed inside the <HEAD> container. Each attribute must be in a separateMETA tag.

Style Sheets

<STYLE> </STYLE>
Attributes:
TYPE="..."
For complete information onstyle sheets clickhere

Scripts

<SCRIPT LANGUAGE="..."> </SCRIPT>

 

Reference : http://w3.org