Make your own free website on

HTML Quick Reference Guide

USE THIS DOCUMENT AS A QUICK REFERENCE for most common tags used in HTML. This reference is not exhaustive and does not attempt in all cases to distinguish among tags that are purely extensions of one browser or another. The tags below will work interchangeably in most browsers and versions. The rule of thumb is: try it and it is doesn't work or is ineffective, try the alternative tag. If a tag doesn't work and you want the greatest number of people and browsers to see an effect, use the simplest tag/approach for the lowest common denominator.

Feel free to print or save this document source. The page is not linked to any style sheet to keep it simple and free of viewing or printing problems. I claim no right of ownership to its text or design. HTML coding also can be found at

:: Return to Class Page ::
Document Structure
<HTML> Encloses the entire
               document </HTML>


<HEAD> Start/end the head
               section </HEAD>


<BODY> Start/end the body
               section </BODY>


<!--your message here-->
               A comment. Good for documentation.


Head Elements
<TITLE> Start/end a title (page title bar)</TITLE>
<BASE HREF="url"> Identify the full URL of this document
Head Elements that help SEARCH Engines
These tags are placed in the <HEAD> </HEAD> section:

A page decription tag:

<META name="description" content="Recommend 25 words or less describing your site">

A tag to provide key word association with your page. Try to keep the words to 25 or fewer. Note: Keep these to the actual content of your page -- No cheating by using popular words not related to your site.

<META name="keywords" content="word1 word2 word3 word4 etc">

Paragraph Styles

<H1>Level 1 Heading</H1>

<H2>Level 2 Heading</H2>

<H3> Level 3 heading </H3>

<H4> Level 4 Heading </H4>

<H5> Level 5 Heading </H5>
<H6> Level 6 Heading </H6>

<P> Start a new paragraph

Force a line break


Horizontal rule

Color change for line: <HR color="RED">

Change line thickness, width, position or fill: <HR size="10" width="50" align="CENTER" noshade>


Quoted text (but, much more: anything you want indented)

<PRE>Preformatted text</PRE> 


<OL> Start/end an ordered list </OL>
<UL> Start/end an unordered list </UL>
<MENU> Start/end a menu </MENU>   
<DIR> Start/end a directory listing </DIR>     
<DL> Start/end a definition list </DL>   
<LI> Start a list item, works with OL, UL , MENU, DIR and DL
<DT> Term to be defined in a definition list
<DD> Term's definition in a definition list
Character Styles
<STRONG> Strong text (same as bold) </STRONG>   
<EM> Emphatic text (same as italic) </EM>
<CITE> A citation </CITE>
A name and/or address
<CODE> Computer code </CODE>
<SAMP> Sample computer output </SAMP>    
<DFN> A definition </DFN>
<KBD> An example keyboard sequence </KBD>
<I> Italic font </I>       
<B> Bold font </B>   
<u> Underlined font </u>    
<TT> Monospaced typewriter font (often the same as preformatted) </TT>

Links and Inline Images

<A HREF="url"> Start/end a link/anchor </A>
<A NAME="name"> Start/end an bookmark/anchor </A>
<A NAME="name" (both a bookmark and a link) HREF="url">      
<IMG SRC="url" An inline image
ALIGN=MIDDLE  aligned with text at the middle
ALIGN=TOP     aligned with text at the top
ALIGN=BOTTOM  aligned with text at the bottom
ALT="text">   text for text-only browsers

Form Documents

<FORM     Start a fill-out form
ACTION="url"     using url as the search script
     METHOD=GET   using the GET method
     METHOD=POST>       using the POST method
</FORM>  End a form
<INPUT     Start an input field
     TYPE="text"       a one-line text entry field
     TYPE="password"   a one-line password entry field
     TYPE="radio"   a radio button
     TYPE="checkbox"   a checkbox
     TYPE="hidden"  a hidden field
     TYPE="image"  an in line image that acts as a button
     TYPE="submit"  the "submit" button
     TYPE="reset"     the "reset" button
     NAME="name"   assign name to this field
     VALUE="value" use value as the default for this field
     SIZE=NN   make text field NN characters wide
     MAXLENGTH=NN  accept at most NN characters in text field
     CHECKED>        Activate (make default) checkbox or radio button
<TEXTAREA       Start a large scrolling text entry field
      ROWS=NN         with NN rows
      COLS=NN>        and NN columns
</TEXTAREA>    End a <TEXTAREA> field
<SELECT  Start a popup menu or scrolling list
      SIZE=NN   NN lines high (Scrolling lists only)
      MULTIPLE>        allowing multiple selections at once
</SELECT>        End a popup menu or scrolling list
<OPTION  Start an entry in a menu or list
      SELECTED        initially selected
      VALUE="value"> with value value, e.g., "Chocolate" is selected as a default flavor


<EM> Emphasis </EM>       
<STRONG> Strong emphasis </STRONG>
<VAR> A variable </VAR>
<DFN> A definition </DFN>
<CITE> A citation </CITE>
<ADDRESS> An address </ADDRESS>
<CODE> Computer code </CODE>
<SAMP> Sample computer output </SAMP>
<KBD> A key from the keyboard </KBD>
Physical (often browser-dependent)
<I> Italic font </I>       
<B> Bold font </B>
<U> Underlined font </U>   
<TT> Monospaced "typewriter" font </TT>
<STRIKE> Strike-through text </STRIKE>     
<BIG> Big font </BIG>       
<SMALL> Small font </SMALL>
<SUP> Superscript font </SUP>     
<SUB> Subscript font </SUB>

Related tags

<BASEFONT>    Default size and color

<FONT> Change size and color </FONT>

<FONT SIZE="+2"> ; Size can equal +1 .. +4 or -1 .. -2


Color can be any of 16 word values: Aqua, Black, Blue, Fuchsia, Gray, Green, Lime, Maroon, Navy, Olive, Purple, Red, Silver, Teal, White, Yellow. See also COLOR WORDS page for other options.

Color also can be be in hexadecimal values: 00 .. FF for each of three colors Red, Green, and Blue. See also COLOR GUIDE page for more options.

Example: <FONT COLOR="#RRGGBB"> RR is for red, GG is green and BB is blue
The RED value can be from 00 (0%) to FF (100%), etc. Hexadecimal counts 0,1,2,3,4,5,6,7,8,9,A,B,C,D,E,F. Hundreds colors can be produced (0-F in all digit positions), but only some 216 (Netscape colors) are seen to be different on most displays. Experiment!

<FONT COLOR="AE3C92">What color is this?</FONT>




<TABLE BORDER="1" BORDERCOLORlight="AQUA" BORDERCOLORdark="NAVY"> A kind of shade effect.
The same rules of colors apply in all cases. See above font color definitions.

Color can be added to text, page backgrounds, table borders, table cell backgrounds and the background of the <MARQUEE> tag for Internet Explorer 4.0 and above: