KiCad-Diff/sampler.html

2208 lines
72 KiB
HTML
Raw Blame History

This file contains invisible Unicode characters

This file contains invisible Unicode characters that are indistinguishable to humans but may be processed differently by a computer. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<HTML>
<HEAD>
<TITLE>Rex Swain's HTML Sampler</TITLE>
<META NAME="description"
CONTENT="See how your browser renders various HTML elements">
<META NAME="keywords" CONTENT="Rex Swain, Rexford H. Swain, HTML,
sample, sampler, cheat sheet, examples">
<META http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<LINK HREF="style.css" REL="stylesheet" TYPE="text/css">
</HEAD>
<BODY>
<!-- Google AdSense added 8/12/2003 -->
<TABLE ALIGN=right WIDTH=176 BORDER=0 CELLSPACING=0 CELLPADDING=0>
<TR>
<TD WIDTH=16>&nbsp;</TD>
<TD WIDTH=160>
<script type="text/javascript"><!--
google_ad_client = "pub-7510521706485409";
google_ad_width = 160;
google_ad_height = 600;
google_ad_format = "160x600_as";
google_color_border = "336699";
google_color_bg = "FFFFFF";
google_color_link = "0000FF";
google_color_url = "008000";
google_color_text = "000000";
google_ad_channel = "4831574137";
//--></script>
<script type="text/javascript" src="http://pagead2.googlesyndication.com/pagead/show_ads.js"></script>
</TD></TR></TABLE>
<CENTER>
<H1>Rex Swain's HTML Sampler</H1>
<H4>See how your browser renders various HTML elements</H4>
<P>Last updated 5 December 1999<BR>
<FONT SIZE=-1>[Minor corrections 19 September 2004]</FONT></P>
</CENTER>
<H3>Contents</H3>
<TABLE><TR><TD VALIGN=top>
<UL>
<LI><A HREF="#head ">HEAD Elements</A>
<UL>
<LI><A HREF="#title ">TITLE</A>
<LI><A HREF="#base ">BASE</A>
<LI><A HREF="#meta ">META</A>
</UL>
<LI><A HREF="#comments">Comments</A>
<LI><A HREF="#headsize">Headings</A>
<LI><A HREF="#fonts ">Fonts</A>
<UL>
<LI><A HREF="#fontsize">Font Sizes</A>
<LI><A HREF="#basefont">Base Font Size</A>
<LI><A HREF="#expstyle">Explicit Font Styles</A>
<LI><A HREF="#logstyle">Logical Font Styles</A>
</UL>
<LI><A HREF="#lists ">Lists</A>
<UL>
<LI><A HREF="#ulists ">Unordered Lists</A>
<LI><A HREF="#olists ">Ordered Lists</A>
<LI><A HREF="#deflists">Definition Lists</A>
<LI><A HREF="#lists2 ">Other Lists</A>
</UL>
<LI><A HREF="#textflow">Text Flow</A>
<UL>
<LI><A HREF="#paravbr ">Paragraph vs. Break</A>
<LI><A HREF="#nobreak ">No Break</A>
<LI><A HREF="#wordbr ">Word Break</A>
<LI><A HREF="#paragr ">Paragraph Alignment</A>
<LI><A HREF="#center ">Centering</A>
<LI><A HREF="#division">Division Alignment</A>
<LI><A HREF="#blockq ">Block Quotes</A>
<LI><A HREF="#notes ">Notes</A>
<LI><A HREF="#fnotes ">Footnotes</A>
<LI><A HREF="#banner ">Banners</A>
<LI><A HREF="#indent ">Indenting Techniques</A>
</UL>
<LI><A HREF="#colors ">Colors</A>
<UL>
<LI><A HREF="#tcolors ">Text Colors</A>
<LI><A HREF="#bgcolors">Background Colors</A>
<LI><A HREF="#excolors">Text, Background &amp; Link Colors</A>
</UL>
</UL></TD><TD VALIGN=top><UL>
<LI><A HREF="#tables ">Tables</A>
<UL>
<LI><A HREF="#tablee ">Table Elements</A>
<LI><A HREF="#captiona">Caption Alignment</A>
<LI><A HREF="#borders ">Table Borders</A>
<LI><A HREF="#tablew ">Table Width &amp; Height</A>
<LI><A HREF="#tablea ">Table Alignment</A>
<LI><A HREF="#horiza ">Horizontal Cell Alignment</A>
<LI><A HREF="#vertia ">Vertical Cell Alignment</A>
<LI><A HREF="#cellspa ">Cell Spacing &amp; Padding</A>
<LI><A HREF="#colwidth">Column Width</A>
<LI><A HREF="#nowrap ">NOWRAP</A>
<LI><A HREF="#tabspan ">Row/Column Span</A>
</UL>
<LI><A HREF="#rules ">Horizontal Rules</A>
<LI><A HREF="#links ">Links and Anchors</A>
<LI><A HREF="#forms ">Forms</A>
<UL>
<LI><A HREF="#ftext ">Text Elements</A>
<LI><A HREF="#fradio ">Radio Buttons</A>
<LI><A HREF="#fcheck ">Checkboxes</A>
<LI><A HREF="#fselect ">Selection Lists</A>
<LI><A HREF="#fhidden ">Hidden Fields</A>
<LI><A HREF="#fsubmit ">Submit/Reset Buttons</A>
</UL>
<LI><A HREF="#images ">Images</A>
<UL>
<LI><A HREF="#imagev ">Vertical Image Alignment</A>
<LI><A HREF="#imageh ">Horizontal Image Alignment</A>
<LI><A HREF="#imageb ">Image Space &amp; Border</A>
<LI><A HREF="#imalt ">Image Alternate Text</A>
<LI><A HREF="#imsize ">Image Size &amp; Scale</A>
<LI><A HREF="#inimages">Internal Images</A>
<LI><A HREF="#csim ">Client-Side Image Maps</A>
<LI><A HREF="#bgimage ">Background Image</A>
<LI><A HREF="#figure ">Figure Element</A>
</UL>
<LI><A HREF="#chars ">Character Entities</A>
</UL>
</TD></TR>
</TABLE>
<H3>Other Summaries and Demos</H3>
<UL>
<LI>See my <A HREF="index.html">home page</A> for other summaries and demos:
APL, REXX, XEDIT, Perl, HTML, RGB Colors, HTTP Cookies, Email Forms,
CGI Environment Variables, Server Side Includes, etc...
</UL>
<P><HR NOSHADE SIZE=4></P>
<A NAME="head"></A>
<H2>HEAD Elements</H2>
<UL>
The HEAD contains general information about the document.
None of the elements authorized to exist in the contents
of the HEAD are displayed; the displayed material is found within the BODY.
<A NAME="title"></A>
<H3>TITLE</H3>
<UL>
<TT>&lt;TITLE&gt;...&lt;/TITLE&gt;</TT>
<P>
The TITLE is not part of the document text.
Often the title is used by a browser to label the display window.
Some Web search engines only search the title of Web pages.
Therefore the text of the TITLE should be kept short but
sufficient to identify the document.
</UL>
<A NAME="base"></A>
<H3>BASE</H3>
<UL>
<TT>&lt;BASE HREF="..." TARGET="..."&gt;</TT>
<P>
The BASE element provides the absolute URL base to be used for any
relative URL links in this document.
It must be a complete file name, and is usually the original URL of this document.
If this file is moved, having the BASE set to the original URL eliminates
the need to also move all the documents which are identified by relative
URL links in this document.
<P>
Netscape 2.0 defines the TARGET attribute to define a default named target window for
every link in a document that does not have an explicit TARGET attribute.
</UL>
<A NAME="meta"></A>
<H3>META</H3>
<UL>
<TT>&lt;META HTTP-EQUIV="..." NAME="..." CONTENT="..."&gt;</TT>
<P>
The META element is used within the HEAD element to embed document meta-information
not defined by other HTML elements.
Such information may be extracted by servers/browsers.
The HTTP-EQUIV attribute binds the element to an HTTP response header.
If not present, the NAME attribute should be used to identify this
meta-information and it should not be used within an HTTP response header.
If the NAME attribute is not present, the name can be assumed equal to the
value of HTTP-EQUIV.
The CONTENT attribute defines the meta-information
content to be associated with the given name and/or HTTP response header.
<P>
The URL attribute is a Netscape extension.
Netscape 1.1 has added a automatic refresh capability using the META
element by setting the HTTP-EQUIV attribute to "REFRESH",
the CONTENT attribute to a number of seconds, and
the URL attribute to the file to load which defaults to reloading the same file.
Netscape 1.1 also recognizes placing the URL inside the quotes which define the
CONTENT value by using a semicolon following the number of seconds,
then the URL=http://... text. For example:
<P>
<LI><TT>&lt;META HTTP-EQUIV="refresh" CONTENT=30 URL="http://..."&gt;</TT>
<LI><TT>&lt;META HTTP-EQUIV="refresh" CONTENT="30;URL=http://..."&gt;</TT>
<P>
Some Web search engines look for the following META elements:
<P>
<LI><TT>&lt;META NAME="description" CONTENT="text ..."&gt;</TT>
<LI><TT>&lt;META NAME="keywords" CONTENT="kw, kw kw ..."&gt;</TT>
<P>
You can avoid browser caching with one of the following:
<P>
<LI><TT>&lt;META HTTP-EQUIV="Expires" CONTENT="Tue, 04 Dec 1993 21:29:02 GMT"&gt;</TT>
<LI><TT>&lt;META HTTP-EQUIV="Pragma" CONTENT="no-cache"&gt;</TT>
<P>
See <A HREF="http://vancouver-webpages.com/META/">http://vancouver-webpages.com/META/</A>
for more details.
</UL>
</UL>
<A NAME="comments"></A>
<H2>Comments</H2>
<UL>
<H3>Single-Line Comments</H3>
<UL>
HTML comments are coded as:
<P>
<TT>&lt;!-- comment --&gt;</TT>
<P>
Here comes one now (you should <I>not</I> see "This Is A Comment" below):
<!-- This Is A Comment -->
</UL>
<H3>Multi-Line Comments</H3>
<UL>
<P>
Many browsers permit multi-line comments, coded as:
<P>
<TT>&lt;!-- comment
<BR>...
<BR>comment --&gt;</TT>
<P>
Here comes one now (you should <I>not</I> see "This Is A Comment" below):
<!-- This
Is A
Comment -->
</UL>
</UL>
<A NAME="headsize"></A>
<H2>Headings</H2>
<UL>
Note that headings automatically generate vertical spacing
both above and below the heading.
<P>
<TABLE BORDER=1>
<TR><TD><TT>&lt;H1&gt;...&lt;/H1&gt;</TT></TD><TD>Normal <H1>Heading 1</H1> Normal</TD></TR>
<TR><TD><TT>&lt;H2&gt;...&lt;/H2&gt;</TT></TD><TD>Normal <H2>Heading 2</H2> Normal</TD></TR>
<TR><TD><TT>&lt;H3&gt;...&lt;/H3&gt;</TT></TD><TD>Normal <H3>Heading 3</H3> Normal</TD></TR>
<TR><TD><TT>&lt;H4&gt;...&lt;/H4&gt;</TT></TD><TD>Normal <H4>Heading 4</H4> Normal</TD></TR>
<TR><TD><TT>&lt;H5&gt;...&lt;/H5&gt;</TT></TD><TD>Normal <H5>Heading 5</H5> Normal</TD></TR>
<TR><TD><TT>&lt;H6&gt;...&lt;/H6&gt;</TT></TD><TD>Normal <H6>Heading 6</H6> Normal</TD></TR>
</TABLE>
</UL>
<A NAME="fonts"></A>
<H2>Fonts</H2>
<UL>
<A NAME="fontsize"></A>
<H3>Font Sizes</H3>
<UL>
<P>Font sizes range from 1 through 7.
The base font size is normally 3; specifying +n or -n adjusts from there.</P>
<TABLE BORDER=1>
<TR><TD><TT>&lt;FONT SIZE=1&gt;...&lt;/FONT&gt;<BR>&lt;FONT SIZE="-2"&gt;...&lt;/FONT&gt;</TT><TD>Normal <FONT SIZE=1>Equals 1</FONT> Normal<BR> Normal <FONT SIZE="-2">Minus 2</FONT> Normal
<TR><TD><TT>&lt;FONT SIZE=2&gt;...&lt;/FONT&gt;<BR>&lt;FONT SIZE="-1"&gt;...&lt;/FONT&gt;</TT><TD>Normal <FONT SIZE=2>Equals 2</FONT> Normal<BR> Normal <FONT SIZE="-1">Minus 1</FONT> Normal
<TR><TD><TT>&lt;FONT SIZE=3&gt;...&lt;/FONT&gt;<BR>&lt;FONT SIZE="-0"&gt;...&lt;/FONT&gt;<BR>&lt;FONT SIZE="+0"&gt;...&lt;/FONT&gt;</TT><TD>Normal <FONT SIZE=3>Equals 3</FONT> Normal<BR>Normal <FONT SIZE="-0">Minus 0</FONT> Normal<BR>Normal <FONT SIZE="+0">Plus 0</FONT> Normal
<TR><TD><TT>&lt;FONT SIZE=4&gt;...&lt;/FONT&gt;<BR>&lt;FONT SIZE="+1"&gt;...&lt;/FONT&gt;</TT><TD>Normal <FONT SIZE=4>Equals 4</FONT> Normal<BR>Normal <FONT SIZE="+1">Plus 1</FONT> Normal
<TR><TD><TT>&lt;FONT SIZE=5&gt;...&lt;/FONT&gt;<BR>&lt;FONT SIZE="+2"&gt;...&lt;/FONT&gt;</TT><TD>Normal <FONT SIZE=5>Equals 5</FONT> Normal<BR>Normal <FONT SIZE="+2">Plus 2</FONT> Normal
<TR><TD><TT>&lt;FONT SIZE=6&gt;...&lt;/FONT&gt;<BR>&lt;FONT SIZE="+3"&gt;...&lt;/FONT&gt;</TT><TD>Normal <FONT SIZE=6>Equals 6</FONT> Normal<BR>Normal <FONT SIZE="+3">Plus 3</FONT> Normal
<TR><TD><TT>&lt;FONT SIZE=7&gt;...&lt;/FONT&gt;<BR>&lt;FONT SIZE="+4"&gt;...&lt;/FONT&gt;</TT><TD>Normal <FONT SIZE=7>Equals 7</FONT> Normal<BR>Normal <FONT SIZE="+4">Plus 4</FONT> Normal
</TABLE>
</UL>
<A NAME="basefont"></A>
<H3>Base Font Size</H3>
<UL>
The BASEFONT element may be used to change the default font size from this point on.
For example:
<P>
<TT>&lt;BASEFONT SIZE="+2"&gt;</TT>
</UL>
<A NAME="expstyle"></A>
<H3>Explicit Font Styles</H3>
<UL>
<TABLE BORDER=1>
<TR><TD><TT>&lt;B&gt;...&lt;/B&gt;</TT><TD>Normal <B>Bold style</B>
<TR><TD><TT>&lt;I&gt;...&lt;/I&gt;</TT><TD>Normal <I>Italic style</I>
<TR><TD><TT>&lt;U&gt;...&lt;/U&gt;</TT><TD>Normal <U>Underlined style</U>
</TABLE>
</UL>
<A NAME="logstyle"></A>
<H3>Logical Font Styles</H3>
<UL>
<TABLE BORDER=1>
<CAPTION><TT>&lt;CAPTION&gt;...&lt;/CAPTION&gt;</TT> style</CAPTION>
<TR><TD><TT>&lt;ABBREV&gt;...&lt;/ABBREV&gt;</TT><TD>Normal <ABBREV>Abbreviation style</ABBREV> Normal
<TR><TD><TT>&lt;ACRONYM&gt;...&lt;/ACRONYM&gt;</TT><TD>Normal <ACRONYM>Acronym style</ACRONYM> Normal
<TR><TD><TT>&lt;ADDRESS&gt;...&lt;/ADDRESS&gt;</TT><TD>Normal <ADDRESS>Address style</ADDRESS> Normal
<TR><TD><TT>&lt;AU&gt;...&lt;/AU&gt;</TT><TD>Normal <AU>Author style</AU> Normal
<TR><TD><TT>&lt;BIG&gt;...&lt;/BIG&gt;</TT><TD>Normal <BIG>Big style</BIG> Normal
<TR><TD><TT>&lt;BLINK&gt;...&lt;/BLINK&gt;</TT><TD>Normal <BLINK>Blink style</BLINK> Normal
<TR><TD><TT>&lt;CITE&gt;...&lt;/CITE&gt;</TT><TD>Normal <CITE>Citation style</CITE> Normal
<TR><TD><TT>&lt;CODE&gt;...&lt;/CODE&gt;</TT><TD>Normal <CODE>Code style</CODE> Normal
<TR><TD><TT>&lt;DEL&gt;...&lt;/DEL&gt;</TT><TD>Normal <DEL>Deleted style</DEL> Normal
<TR><TD><TT>&lt;DFN&gt;...&lt;/DFN&gt;</TT><TD>Normal <DFN>Defining Instance style</DFN> Normal
<TR><TD><TT>&lt;EM&gt;...&lt;/EM&gt;</TT><TD>Normal <EM>Emphasis style</EM> Normal
<TR><TD><TT>&lt;INS&gt;...&lt;/INS&gt;</TT><TD>Normal <INS>Inserted style</INS> Normal
<TR><TD><TT>&lt;KBD&gt;...&lt;/KBD&gt;</TT><TD>Normal <KBD>Keyboard style</KBD> Normal
<TR><TD><TT>&lt;LISTING&gt;...&lt;/LISTING&gt;</TT><TD>Normal <LISTING>Listing style</LISTING> Normal
<TR><TD><TT>&lt;PERSON&gt;...&lt;/PERSON&gt;</TT><TD>Normal <PERSON>Person style</PERSON> Normal
<TR><TD><TT>&lt;PRE&gt;...&lt;/PRE&gt;</TT><TD>Normal <PRE>Preformatted style</PRE> Normal
<TR><TD><TT>&lt;Q&gt;...&lt;/Q&gt;</TT><TD>Normal <Q>Quotation style</Q> Normal
<TR><TD><TT>&lt;S&gt;...&lt;/S&gt;</TT><TD>Normal <S>Strikethrough style</S> Normal
<TR><TD><TT>&lt;SAMP&gt;...&lt;/SAMP&gt;</TT><TD>Normal <SAMP>Sample style</SAMP> Normal
<TR><TD><TT>&lt;SMALL&gt;...&lt;/SMALL&gt;</TT><TD>Normal <SMALL>Small style</SMALL> Normal
<TR><TD><TT>&lt;STRIKE&gt;...&lt;/STRIKE&gt;</TT><TD>Normal <STRIKE>Strikethrough style</STRIKE> Normal
<TR><TD><TT>&lt;STRONG&gt;...&lt;/STRONG&gt;</TT><TD>Normal <STRONG>Strong style</STRONG> Normal
<TR><TD><TT>&lt;SUB&gt;...&lt;/SUB&gt;</TT><TD>Normal <SUB>Subscripted style</SUB> Normal
<TR><TD><TT>&lt;SUP&gt;...&lt;/SUP&gt;</TT><TD>Normal <SUP>Superscripted style</SUP> Normal
<TR><TD><TT>&lt;TT&gt;...&lt;/TT&gt;</TT><TD>Normal <TT>TeleType style</TT> Normal
<TR><TD><TT>&lt;VAR&gt;...&lt;/VAR&gt;</TT><TD>Normal <VAR>Variable style</VAR> Normal
<TR><TD ROWSPAN=2><TT>&lt;XMP&gt;...&lt;/XMP&gt;</TT><TD>Normal <XMP>XMP style</XMP> Normal
<TR><TD>Note: tags within an XMP block are not interpreted!
<BR><XMP>XMP: Here's an &amp; ampersand</XMP>
Normal: Here's an &amp; ampersand
</TABLE>
</UL>
</UL>
<A NAME="lists"></A>
<H2>Lists</H2>
<UL>
<A NAME="ulists"></A>
<H3>Unordered Lists</H3>
<UL>
<TABLE BORDER=1>
<TR>
<TD>Unordered List
<TD><TT>
&lt;UL&gt;<BR>
&lt;LI&gt;Item 1<BR>
&lt;LI&gt;Item 2<BR>
&lt;LI&gt;Item 3<BR>
&lt;/UL&gt;
</TT>
<TD>
<UL>
<LI>Item 1
<LI>Item 2
<LI>Item 3
</UL>
<TR>
<TD>Unordered List<BR>(multi-level)
<TD><TT>
&lt;UL&gt;<BR>
&lt;LI&gt;Level 1, Item 1<BR>
&lt;UL&gt;<BR>
&lt;LI&gt;Level 2, Item 1<BR>
&lt;UL&gt;<BR>
&lt;LI&gt;Level 3, Item 1<BR>
&lt;LI&gt;Level 3, Item 2<BR>
&lt;/UL&gt;<BR>
&lt;LI&gt;Level 2, Item 2<BR>
&lt;/UL&gt;<BR>
&lt;/UL&gt;
</TT>
<TD>
<UL><LI>Level 1, Item 1
<UL><LI>Level 2, Item 1
<UL><LI>Level 3, Item 1
<LI>Level 3, Item 2
</UL>
<LI>Level 2, Item 2
</UL>
</UL>
<TR>
<TD>Unordered List<BR>(with option)
<TD><TT>&lt;UL PLAIN&gt;<BR>...<BR>&lt;/UL&gt;</TT><TD>
<UL PLAIN>
<LI>Item 1
<LI>Item 2
<LI>Item 3
</UL>
<TR>
<TD>Unordered List<BR>(with options)
<TD><TT>&lt;UL PLAIN COMPACT&gt;<BR>...<BR>&lt;/UL&gt;</TT><TD>
<UL PLAIN COMPACT>
<LI>Item 1
<LI>Item 2
<LI>Item 3
</UL>
<TR>
<TD>Unordered List<BR>(with options)
<TD><TT>&lt;UL PLAIN WRAP=horiz&gt;<BR>...<BR>&lt;/UL&gt;</TT><TD>
<UL PLAIN WRAP=horiz>
<LI>Item 1
<LI>Item 2
<LI>Item 3
</UL>
<TR>
<TD>Unordered List<BR>(with List Heading)
<TD><TT>
&lt;UL&gt;<BR>
&lt;LH&gt;Heading&lt;/LH&gt;<BR>
&lt;LI&gt;Item 1<BR>
&lt;LI&gt;Item 2<BR>
&lt;/UL&gt;
</TT><TD>
<UL>
<LH>Heading</LH>
<LI>Item 1
<LI>Item 2
</UL>
<TR>
<TD>Unordered List<BR>(with bullet style option)
<TD><TT>&lt;UL TYPE=circle&gt;<BR>...<BR>&lt;/UL&gt;</TT><TD>
<UL TYPE=circle>
<LI>Item 1
<LI>Item 2
</UL>
<TR>
<TD>Unordered List<BR>(with bullet style option)
<TD><TT>&lt;UL TYPE=square&gt;<BR>...<BR>&lt;/UL&gt;</TT><TD>
<UL TYPE=square>
<LI>Item 1
<LI>Item 2
</UL>
<TR>
<TD>Unordered List<BR>(with bullet style option)
<TD><TT>&lt;UL TYPE=disc&gt;<BR>...<BR>&lt;/UL&gt;</TT><TD>
<UL TYPE=disc>
<LI>Item 1
<LI>Item 2
</UL>
<TR>
<TD>Unordered List<BR>(with bullet style options)
<TD><TT>
&lt;UL&gt;<BR>
&lt;LI TYPE=circle&gt;...<BR>
&lt;LI TYPE=square&gt;...<BR>
&lt;LI TYPE=disc&gt;...<BR>
&lt;/UL&gt;
</TT><TD>
<UL>
<LI TYPE=circle>Item 1
<LI TYPE=square>Item 2
<LI TYPE=disc>Item 3
</UL>
<TR>
<TD>Unordered List<BR>(items without list)
<TD><TT>
&lt;LI&gt;Item 1<BR>
&lt;LI&gt;Item 2<BR>
&lt;LI&gt;Item 3<BR>
</TT><TD>
<LI>Item 1
<LI>Item 2
<LI>Item 3
<TR>
<TD>Directory List<BR>(like an unordered list)
<BR><I>Items should be less<BR>than 20 characters long</I>
<TD><TT>
&lt;DIR&gt;<BR>
&lt;LI&gt;Item 1<BR>
&lt;LI&gt;Item 2<BR>
&lt;LI&gt;Item 3<BR>
&lt;/DIR&gt;
</TT><TD>
<DIR>
<LI>Item 1
<LI>Item 2
<LI>Item 3
</DIR>
<TR>
<TD>Menu List<BR>(like an unordered list)
<BR><I>Presents an interactive list<BR>(?)</I>
<TD><TT>
&lt;MENU&gt;<BR>
&lt;LI&gt;Item 1<BR>
&lt;LI&gt;Item 2<BR>
&lt;LI&gt;Item 3<BR>
&lt;/MENU&gt;
</TT><TD>
<MENU>
<LI>Item 1
<LI>Item 2
<LI>Item 3
</MENU>
</TABLE>
</UL>
<A NAME="olists"></A>
<H3>Ordered Lists</H3>
<UL>
<TABLE BORDER=1>
<TR>
<TD>Ordered List
<TD><TT>
&lt;OL&gt;<BR>
&lt;LI&gt;Item 1<BR>
&lt;LI&gt;Item 2<BR>
&lt;LI&gt;Item 3<BR>
&lt;/OL&gt;
</TT>
<TD>
<OL>
<LI>Item 1
<LI>Item 2
<LI>Item 3
</OL>
<TR>
<TD>Ordered List<BR>(multi-level)
<TD><TT>
&lt;OL&gt;<BR>
&lt;LI&gt;Level 1, Item 1<BR>
&lt;OL&gt;<BR>
&lt;LI&gt;Level 2, Item 1<BR>
&lt;OL&gt;<BR>
&lt;LI&gt;Level 3, Item 1<BR>
&lt;LI&gt;Level 3, Item 2<BR>
&lt;/OL&gt;<BR>
&lt;LI&gt;Level 2, Item 2<BR>
&lt;/OL&gt;<BR>
&lt;/OL&gt;
</TT>
<TD>
<OL><LI>Level 1, Item 1
<OL><LI>Level 2, Item 1
<OL><LI>Level 3, Item 1
<LI>Level 3, Item 2
</OL>
<LI>Level 2, Item 2
</OL>
</OL>
<TR>
<TD>Ordered List<BR>(with option)
<TD><TT>&lt;OL TYPE="i"&gt;<BR>...<BR>&lt;/OL&gt;</TT><TD>
<OL TYPE="i">
<LI>Item 1
<LI>Item 2
<LI>Item 3
<LI>Item 4
<LI>Item 5
</OL>
<TR>
<TD>Ordered List<BR>(with options)
<TD><TT>&lt;OL TYPE="I" START=6&gt;<BR>...<BR>&lt;/OL&gt;</TT><TD>
<OL TYPE="I" START=6>
<LI>Item 1
<LI>Item 2
<LI>Item 3
<LI>Item 4
<LI>Item 5
</OL>
<TR>
<TD>Ordered List<BR>(with option)
<TD><TT>&lt;OL TYPE="a"&gt;<BR>...<BR>&lt;/OL&gt;</TT><TD>
<OL TYPE="a">
<LI>Item 1
<LI>Item 2
<LI>Item 3
<LI>Item 4
<LI>Item 5
</OL>
<TR>
<TD>Ordered List<BR>(with option)
<TD><TT>&lt;OL TYPE="A"&gt;<BR>...<BR>&lt;/OL&gt;</TT><TD>
<OL TYPE="A">
<LI>Item 1
<LI>Item 2
<LI>Item 3
<LI>Item 4
<LI>Item 5
</OL>
</TABLE>
</UL>
<A NAME="deflists"></A>
<H3>Definition Lists</H3>
<UL>
<TABLE BORDER=1>
<TR><TD>Definition List<TD><TT>
&lt;DL&gt;<BR>
&lt;DT&gt;Term 1<BR>
&lt;DD&gt;Defn 1<BR>
&lt;DT&gt;Term 2<BR>
&lt;DD&gt;Defn 2<BR>
...<BR>
&lt;/DL&gt;
</TT><TD>
<DL>
<DT>
This is the &lt;DT&gt; text.
<DD>
This is the &lt;DD&gt; text.
<DT>
Here's a second hunk of &lt;DT&gt; text repeated three times.
Here's a second hunk of &lt;DT&gt; text repeated three times.
Here's a second hunk of &lt;DT&gt; text repeated three times.
<DD>
Here's a second hunk of &lt;DD&gt; text repeated three times.
Here's a second hunk of &lt;DD&gt; text repeated three times.
Here's a second hunk of &lt;DD&gt; text repeated three times.
<DT>DT<DD>DD following very short DT
<DT>DT<DD>DD following very short DT
</DL>
<TR><TD>Definition List<BR>(with option)<TD><TT>
&lt;DL COMPACT&gt;<BR>
&lt;DT&gt;Term 1<BR>
&lt;DD&gt;Defn 1<BR>
&lt;DT&gt;Term 2<BR>
&lt;DD&gt;Defn 2<BR>
...<BR>
&lt;/DL&gt;
</TT><TD>
<DL COMPACT>
<DT>
This is the &lt;DT&gt; text.
<DD>
This is the &lt;DD&gt; text.
<DT>
Here's a second hunk of &lt;DT&gt; text repeated three times.
Here's a second hunk of &lt;DT&gt; text repeated three times.
Here's a second hunk of &lt;DT&gt; text repeated three times.
<DD>
Here's a second hunk of &lt;DD&gt; text repeated three times.
Here's a second hunk of &lt;DD&gt; text repeated three times.
Here's a second hunk of &lt;DD&gt; text repeated three times.
<DT>DT<DD>DD following very short DT
<DT>DT<DD>DD following very short DT
</DL>
</TABLE>
</UL>
<A NAME="lists2"></A>
<H3>Other Lists</H3>
<UL>
<TABLE BORDER=1>
<TR>
<TD>Directory List<BR>(like an unordered list)
<BR><I>Items should be less<BR>than 20 characters long</I>
<TD><TT>
&lt;DIR&gt;<BR>
&lt;LI&gt;Item 1<BR>
&lt;LI&gt;Item 2<BR>
&lt;LI&gt;Item 3<BR>
&lt;/DIR&gt;
</TT><TD>
<DIR>
<LI>Item 1
<LI>Item 2
<LI>Item 3
</DIR>
<TR>
<TD>Menu List<BR>(like an unordered list)
<BR><I>Presents an interactive list<BR>(?)</I>
<TD><TT>
&lt;MENU&gt;<BR>
&lt;LI&gt;Item 1<BR>
&lt;LI&gt;Item 2<BR>
&lt;LI&gt;Item 3<BR>
&lt;/MENU&gt;
</TT><TD>
<MENU>
<LI>Item 1
<LI>Item 2
<LI>Item 3
</MENU>
</TABLE>
</UL>
</UL>
<A NAME="textflow"></A>
<H2>Text Flow</H2>
<UL>
<A NAME="paravbr"></A>
<H3>Paragraph vs. Break</H3>
<UL>
<TABLE BORDER=1>
<TR><TD>Paragraph<TD><TT>...<BR>&lt;P&gt;<BR>...</TT><TD>
This is some text repeated a bunch of times.
This is some text repeated a bunch of times.
Note that a closing &lt;/P&gt; is optional in most browsers, and is not used here.
Here comes a &lt;P&gt; ...
<P>
This is the beginning of another paragraph.
Note that &lt;P&gt; inserts a blank line.
This is some text repeated a bunch of times.
This is some text repeated a bunch of times.
This is some text repeated a bunch of times.
<TR><TD>Paragraph<BR>(with closing tag)<TD><TT>&lt;P&gt;<BR>...<BR>&lt;/P&gt;</TT><TD>
Netscape adds a blank line after a paragraph which ends with a &lt;/P&gt;.
This is some text repeated a bunch of times.
This is some text repeated a bunch of times.
Here comes a &lt;/P&gt; and then another &lt;P&gt; ...</P>
<P>
This is the beginning of another paragraph.
This is some text repeated a bunch of times.
This is some text repeated a bunch of times.
Here comes a &lt;/P&gt;.</P>
<TR><TD>Break<TD><TT>...<BR>&lt;BR&gt;<BR>...</TT><TD>
This is some text repeated a bunch of times.
This is some text repeated a bunch of times.
Here comes a &lt;BR&gt; ...
<BR>
Note that &lt;BR&gt; does NOT insert a blank line.
This is some text repeated a bunch of times.
This is some text repeated a bunch of times.
</TABLE>
</UL>
<A NAME="nobreak"></A>
<H3>No Break</H3>
<UL>
<TABLE BORDER=1>
<TR><TD>Normal
<TD><TT>...</TT><TD>
This is some text repeated three times.
This is some text repeated three times.
This is some text repeated three times.
<TR><TD>No Break
<TD><TT>&lt;NOBR&gt;<BR>...<BR>&lt;/NOBR&gt;</TT><TD>
<NOBR>
This is some text repeated three times.
This is some text repeated three times.
This is some text repeated three times.
</NOBR>
</TABLE>
<P>
If necessary, reduce the width of your browser's window.
Notice that NOBR prevents the text from breaking (word-wrapping).
</UL>
<A NAME="wordbr"></A>
<H3>Word Break</H3>
<UL>
Use the <TT>&lt;WBR&gt;</TT> tag to insert an optional word break
in the middle of a very long "word".
<P>
In the examples below, there are 52 letters (A through Z repeated twice).
In the first case, there are no spaces; in the second case, there is a
<TT>&lt;WBR&gt;</TT> word break between the first Z and second A.
<P>
ABCDEFGHIJKLMNOPQRSTUVWXYZABCDEFGHIJKLMNOPQRSTUVWXYZ
<P>
ABCDEFGHIJKLMNOPQRSTUVWXYZ<WBR>ABCDEFGHIJKLMNOPQRSTUVWXYZ
<P>
If the browser window is wide enough to display the entire word, it appears
without any space or break.
If the window is not wide enough, the <TT>&lt;WBR&gt;</TT> tag
tells the browser where it may break the word.
(You may have to reduce the
width of your browser's window to see the difference.)
<P>
This is particularly useful for citing very long URLs.
</UL>
<A NAME="paragr"></A>
<H3>Paragraph Alignment</H3>
<UL>
<TABLE BORDER=1>
<TR><TD>Paragraph<BR>(with alignment option)<TD><TT>&lt;P ALIGN=left&gt;<BR>...</TT><TD>
<P ALIGN=left>
This is some text repeated a bunch of times.
This is some text repeated a bunch of times.
This is some text repeated a bunch of times.
This is some text repeated a bunch of times.
This is some text repeated a bunch of times.
<TR><TD>Paragraph<BR>(with alignment option)<TD><TT>&lt;P ALIGN=right&gt;<BR>...</TT><TD>
<P ALIGN=right>
This is some text repeated a bunch of times.
This is some text repeated a bunch of times.
This is some text repeated a bunch of times.
This is some text repeated a bunch of times.
This is some text repeated a bunch of times.
<TR><TD>Paragraph<BR>(with alignment option)<TD><TT>&lt;P ALIGN=center&gt;<BR>...</TT><TD>
<P ALIGN=center>
This is some text repeated a bunch of times.
This is some text repeated a bunch of times.
This is some text repeated a bunch of times.
This is some text repeated a bunch of times.
This is some text repeated a bunch of times.
</TABLE>
</UL>
<A NAME="center"></A>
<H3>Centering</H3>
<UL>
<TABLE BORDER=1>
<TR><TD>Center<TD><TT>&lt;CENTER&gt;<BR>...<BR>&lt;/CENTER&gt;</TT><TD>
<CENTER>
Note that &lt;CENTER&gt; can center nearly anything: headings, text, tables, etc.
This is some text repeated a bunch of times.
This is some text.
Here comes a &lt;H4&gt; heading...
<H4>A Heading</H4>
This is some more text repeated a bunch of times.
This is some text.
This is some text repeated a bunch of times.</CENTER>
</TABLE>
</UL>
<A NAME="division"></A>
<H3>Division Alignment</H3>
<UL>
Like &lt;CENTER&gt;, &lt;DIVISION&gt; may be used to align blocks of other elements.
<P>
<DIV align=left>
This is the beginning of a <TT>&lt;DIV ALIGN=left&gt;</TT> block
<H4>This is an H4 heading</H4>
An unordered list:
<UL><LI>One<LI>Two<LI>Three, etc.</UL>
This is the end of the division; here comes <TT>&lt;/DIV&gt;</TT>
</DIV>
<P>
<DIV align=center>
This is the beginning of a <TT>&lt;DIV ALIGN=center&gt;</TT> block
<H4>This is an H4 heading</H4>
An unordered list:
<UL><LI>One<LI>Two<LI>Three, etc.</UL>
This is the end of the division; here comes <TT>&lt;/DIV&gt;</TT>
</DIV>
<P>
<DIV align=right>
This is the beginning of a <TT>&lt;DIV ALIGN=right&gt;</TT> block
<H4>This is an H4 heading</H4>
An unordered list:
<UL><LI>One<LI>Two<LI>Three, etc.</UL>
This is the end of the division; here comes <TT>&lt;/DIV&gt;</TT>
</DIV>
</UL>
<A NAME="blockq"></A>
<H3>Block Quotes</H3>
<UL>
<TABLE BORDER=1>
<TR><TD>Block Quote<TD><TT>&lt;BLOCKQUOTE&gt;<BR>...<BR>&lt;/BLOCKQUOTE&gt;</TT><TD>
<BLOCKQUOTE>
Text should be both left- and right-indented.
Some browsers render the text in italics.
Now there is a &lt;/BLOCKQUOTE&gt;
immediately followed by a new &lt;BLOCKQUOTE&gt;
and then some more text;
there is NOT a &lt;P&gt;.
</BLOCKQUOTE>
<BLOCKQUOTE>
This is some text repeated a bunch of times.
This is some text repeated a bunch of times.
This is some text repeated a bunch of times.
This is some text repeated a bunch of times.
</BLOCKQUOTE>
<TR><TD>Block Quote<BR><IMG SRC="n2x.gif">
<TD><TT>&lt;BQ&gt;<BR>...<BR>&lt;/BQ&gt;</TT><TD>
<BQ>
Netscape 1.22 and 2.01 do not support the &lt;BQ&gt; tag.
Now there is a &lt;/BQ&gt;
immediately followed by a new &lt;BQ&gt;
and then some more text;
there is NOT a &lt;P&gt;.
</BQ>
<BQ>
This is some text repeated a bunch of times.
This is some text repeated a bunch of times.
This is some text repeated a bunch of times.
This is some text repeated a bunch of times.
</BQ>
</TABLE>
</UL>
<A NAME="notes"></A>
<H3>Notes</H3>
<UL>
<TABLE BORDER=1>
<TR><TD>Note<BR><IMG SRC="n2x.gif">
<TD><TT>&lt;NOTE&gt;<BR>...<BR>&lt;/NOTE&gt;</TT><TD>
<NOTE>
This is some text repeated a bunch of times.
Netscape 1.22 and 2.01 do not seem to support this feature.
This is some text repeated a bunch of times.
This is some text repeated a bunch of times.
This is some text repeated a bunch of times.
</NOTE>
<TR><TD>Note<BR>(with option)<BR><IMG SRC="n2x.gif">
<TD><TT>&lt;NOTE ROLE=tip&gt;<BR>...<BR>&lt;/NOTE&gt;</TT><TD>
<NOTE ROLE=tip>
This is some text repeated a bunch of times.
Netscape 1.22 and 2.01 do not seem to support this feature.
This is some text repeated a bunch of times.
This is some text repeated a bunch of times.
This is some text repeated a bunch of times.
</NOTE>
<TR><TD>Note<BR>(with option)<BR><IMG SRC="n2x.gif">
<TD><TT>&lt;NOTE ROLE=warning&gt;<BR>...<BR>&lt;/NOTE&gt;</TT><TD>
<NOTE ROLE=warning>
This is some text repeated a bunch of times.
Netscape 1.22 and 2.01 do not seem to support this feature.
This is some text repeated a bunch of times.
This is some text repeated a bunch of times.
This is some text repeated a bunch of times.
</NOTE>
</TABLE>
</UL>
<A NAME="fnotes"></A>
<H3>Foototes</H3>
<UL>
<TABLE BORDER=1>
<TR><TD>Footnote<BR><IMG SRC="n2x.gif">
<TD><TT>&lt;FN ID="..."&gt;<BR>...<BR>&lt;/FN&gt;</TT><TD>
<P>
This is a normal &lt;P&gt; paragraph with a <A HREF="#fn1">footnote</A> reference
(coded as &lt;A HREF="#fn1"&gt;footnote&lt;/A&gt;).
In theory, when you click on the reference, the footnote appears.
Netscape 1.22 and 2.01 do not seem to support this feature.
</P>
<FN ID="fn1">
This is a footnote paragraph
(coded as &lt;FN ID="fn1"&gt;).
his is some more of the footnote text.
This is some more of the footnote text.
</FN>
</TABLE>
</UL>
<A NAME="banner"></A>
<H3>Banners</H3>
<UL>
<TABLE BORDER=1>
<TR><TD>Banner<BR><IMG SRC="n2x.gif">
<TD><TT>&lt;BANNER&gt;<BR>...<BR>&lt;/BANNER&gt;</TT><TD>
<BANNER>
This is a banner.
Netscape 1.22 and 2.01 do not seem to support this feature.
</BANNER>
</TABLE>
</UL>
<A NAME="indent"></A>
<H3>Indenting Techniques</H3>
<UL>
<TABLE BORDER=1>
<TR><TD>Unordered List<BR>(with no items)<TD><TT>&lt;UL&gt;<BR>...<BR>&lt;/UL&gt;</TT><TD>
<UL>
Text should be left-indented.
This is some text repeated a bunch of times.
This is some text repeated a bunch of times.
This is some text repeated a bunch of times.
This is some text repeated a bunch of times.</UL>
<TR><TD>Definition List<BR>(with no terms)<TD><TT>
&lt;DL&gt;<BR>
&lt;DD&gt;Defn<BR>
&lt;/DL&gt;
</TT><TD>
<DL>
<DD>
Text should be left-indented.
This is some text repeated a bunch of times.
This is some text repeated a bunch of times.
This is some text repeated a bunch of times.
This is some text repeated a bunch of times.
</DL>
<TR><TD>Block Quote<TD><TT>&lt;BLOCKQUOTE&gt;<BR>...<BR>&lt;/BLOCKQUOTE&gt;</TT><TD>
<BLOCKQUOTE>
Text should be both left- and right-indented.
Some browsers render the text in italics.
This is some text repeated a bunch of times.
This is some text repeated a bunch of times.
</BLOCKQUOTE>
</TABLE>
</UL>
</UL>
<A NAME="colors"></A>
<H2>Colors</H2>
<UL>
<!-- <IMG SRC="new.gif" WIDTH=28 HEIGHT=11 ALT="New"> -->
Try my
<A HREF="/cgi-bin/colors.cgi">Zoomable RGB Color Sampler</A>.
<A NAME="tcolors"></A>
<H3>Text Colors</H3>
<UL>
Font colors may be specified as follows:
<P>
<TT>&lt;FONT COLOR="#rrggbb"&gt;...&lt;/FONT&gt;</TT>
<P>
In theory, there are 256 <SUP>3</SUP> or 16,777,216 possible colors.
<P>
Here are 27 samples of <TT>&lt;FONT COLOR="#rrggbb"&gt;</TT>:
<P>
<!-- From COLORS.KEX -->
<PRE>
#000000: <FONT COLOR=#000000>000000 Sample</FONT> (Black)
#000080: <FONT COLOR=#000080>000080 Sample</FONT>
#0000FF: <FONT COLOR=#0000FF>0000FF Sample</FONT> (Blue)
#008000: <FONT COLOR=#008000>008000 Sample</FONT>
#008080: <FONT COLOR=#008080>008080 Sample</FONT>
#0080FF: <FONT COLOR=#0080FF>0080FF Sample</FONT>
#00FF00: <FONT COLOR=#00FF00>00FF00 Sample</FONT> (Green)
#00FF80: <FONT COLOR=#00FF80>00FF80 Sample</FONT>
#00FFFF: <FONT COLOR=#00FFFF>00FFFF Sample</FONT> (Cyan)
#800000: <FONT COLOR=#800000>800000 Sample</FONT>
#800080: <FONT COLOR=#800080>800080 Sample</FONT>
#8000FF: <FONT COLOR=#8000FF>8000FF Sample</FONT>
#808000: <FONT COLOR=#808000>808000 Sample</FONT>
#808080: <FONT COLOR=#808080>808080 Sample</FONT>
#8080FF: <FONT COLOR=#8080FF>8080FF Sample</FONT>
#80FF00: <FONT COLOR=#80FF00>80FF00 Sample</FONT>
#80FF80: <FONT COLOR=#80FF80>80FF80 Sample</FONT>
#80FFFF: <FONT COLOR=#80FFFF>80FFFF Sample</FONT>
#FF0000: <FONT COLOR=#FF0000>FF0000 Sample</FONT> (Red)
#FF0080: <FONT COLOR=#FF0080>FF0080 Sample</FONT>
#FF00FF: <FONT COLOR=#FF00FF>FF00FF Sample</FONT> (Magenta)
#FF8000: <FONT COLOR=#FF8000>FF8000 Sample</FONT>
#FF8080: <FONT COLOR=#FF8080>FF8080 Sample</FONT>
#FF80FF: <FONT COLOR=#FF80FF>FF80FF Sample</FONT>
#FFFF00: <FONT COLOR=#FFFF00>FFFF00 Sample</FONT> (Yellow)
#FFFF80: <FONT COLOR=#FFFF80>FFFF80 Sample</FONT>
#FFFFFF: <FONT COLOR=#FFFFFF>FFFFFF Sample</FONT> (White)
</PRE>
</UL>
<A NAME="bgcolors"></A>
<H3>Background Colors</H3>
<UL>
Background color may be specified as an option in the &lt;BODY&gt; tag,
as follows:
<P>
<TT>&lt;BODY BGCOLOR="#rrggbb"&gt;</TT>
<P>
In theory, there are 256 <SUP>3</SUP> or 16,777,216 possible colors.
<P>
Another way to look at this:
Doug Jacobson's <STRONG>RGB Hex Triplet Color Chart</STRONG>
<P>
<A HREF="htmlrgb.gif"><IMG SRC="htmlrgbt.gif" ALT=" [htmlrgb.gif] " WIDTH=100 HEIGHT=161></A>
Click on the thumbnail image to see the full chart (61k).
<!-- IMG SRC="htmlrgb.gif" WIDTH=491 HEIGHT=791 -->
</UL>
<A NAME="excolors"></A>
<H3>Text, Background &amp; Link Colors</H3>
<UL>
Various custom colors may be specified as options in the &lt;BODY&gt; tag,
as follows:<P><TT>
&lt;BODY BGCOLOR="#rrggbb" TEXT="#rrggbb"
LINK="#rrggbb" VLINK="#rrggbb" ALINK="#rrggbb"&gt;
</TT><P>
<TABLE BORDER=1>
<TH ALIGN=left>Option<TH ALIGN=left>Sets color of...
<TR><TD><TT>BGCOLOR</TT><TD>Background
<TR><TD><TT>TEXT</TT><TD>Normal text
<TR><TD><TT>LINK</TT><TD>Link text (unvisited)
<TR><TD><TT>VLINK</TT><TD>Visited Link text
<TR><TD><TT>ALINK</TT><TD>Activated Link text (as link is clicked)
</TABLE>
</UL>
</UL>
<A NAME="tables"></A>
<H2>Tables</H2>
<UL>
<A NAME="tablee"></A>
<H3>Table Elements</H3>
<UL>
<TABLE BORDER=1>
<CAPTION>This is a <TT>&lt;CAPTION&gt;</TT> Caption</CAPTION>
<TH>This is a <TT>&lt;TH&gt;</TT> Table Heading
<TR><TD>This is <TT>&lt;TD&gt;</TT> Table Data
<TR><TD>This is <TT>&lt;TD&gt;</TT> Table Data that is long to expand the table horizontally.
<TR><TD>This is <TT>&lt;TD&gt;</TT> Table Data
</TABLE>
<P>The table above is coded as:<P>
<TT>&lt;TABLE BORDER=1&gt;
<BR>&lt;CAPTION&gt;This is ...&lt;/CAPTION&gt;
<BR>&lt;TH&gt;This is ...
<BR>&lt;TR&gt;&lt;TD&gt;This is ...
<BR>&lt;TR&gt;&lt;TD&gt;This is ...
<BR>&lt;TR&gt;&lt;TD&gt;This is ...
<BR>&lt;/TABLE&gt;
</TT>
</UL>
<A NAME="captiona"></A>
<H3>Caption Alignment</H3>
<UL>
<TABLE BORDER=1>
<CAPTION>This is a <TT>&lt;CAPTION&gt;</TT> Caption</CAPTION>
<TR><TD>This is <TT>&lt;TD&gt;</TT> Table Data that is long to expand the table horizontally.
</TABLE>
<P>
<TABLE BORDER=1>
<CAPTION ALIGN=bottom>This is a <TT>&lt;CAPTION ALIGN=bottom&gt;</TT> Caption</CAPTION>
<TR><TD>This is <TT>&lt;TD&gt;</TT> Table Data that is long to expand the table horizontally.
</TABLE>
</UL>
<A NAME="borders"></A>
<H3>Table Borders</H3>
<UL>
<TABLE>
<CAPTION><TT>&lt;TABLE&gt;</TT></CAPTION>
<TR><TD>This<TD>is<TR><TD>a<TD>table blah blah blah blah blah blah blah blah
</TABLE>
<P>
<TABLE BORDER>
<CAPTION><TT>&lt;TABLE BORDER&gt;</TT></CAPTION>
<TR><TD>This<TD>is<TR><TD>a<TD>table blah blah blah blah blah blah blah blah
</TABLE>
<P>
<TABLE BORDER=0>
<CAPTION><TT>&lt;TABLE BORDER=0&gt;</TT></CAPTION>
<TR><TD>This<TD>is<TR><TD>a<TD>table blah blah blah blah blah blah blah blah
</TABLE>
<P>
<TABLE BORDER=1>
<CAPTION><TT>&lt;TABLE BORDER=1&gt;</TT></CAPTION>
<TR><TD>This<TD>is<TR><TD>a<TD>table blah blah blah blah blah blah blah blah
</TABLE>
<P>
<TABLE BORDER=2>
<CAPTION><TT>&lt;TABLE BORDER=2&gt;</TT></CAPTION>
<TR><TD>This<TD>is<TR><TD>a<TD>table blah blah blah blah blah blah blah blah
</TABLE>
<P>
<TABLE BORDER=4>
<CAPTION><TT>&lt;TABLE BORDER=4&gt;</TT></CAPTION>
<TR><TD>This<TD>is<TR><TD>a<TD>table blah blah blah blah blah blah blah blah
</TABLE>
<P>
<TABLE BORDER=8>
<CAPTION><TT>&lt;TABLE BORDER=8&gt;</TT></CAPTION>
<TR><TD>This<TD>is<TR><TD>a<TD>table blah blah blah blah blah blah blah blah
</TABLE>
<P>
<TABLE BORDER=16>
<CAPTION><TT>&lt;TABLE BORDER=16&gt;</TT></CAPTION>
<TR><TD>This<TD>is<TR><TD>a<TD>table blah blah blah blah blah blah blah blah
</TABLE>
</UL>
<A NAME="tablew"></A>
<H3>Table Width &amp; Height</H3>
<UL>
<TABLE BORDER=1>
<CAPTION><TT>&lt;TABLE BORDER=1&gt;</TT></CAPTION>
<TR><TD>This<TD>is<TR><TD>a<TD>table blah blah blah blah blah blah
</TABLE>
<P>
<TABLE BORDER=1 WIDTH="50%">
<CAPTION><TT>&lt;TABLE BORDER=1 WIDTH="50%"&gt;</TT></CAPTION>
<TR><TD>This<TD>is<TR><TD>a<TD>table blah blah blah blah blah blah
</TABLE>
<P>
<TABLE BORDER=1 WIDTH="90%">
<CAPTION><TT>&lt;TABLE BORDER=1 WIDTH="90%"&gt;</TT></CAPTION>
<TR><TD>This<TD>is<TR><TD>a<TD>table blah blah blah blah blah blah
</TABLE>
<P>
<TABLE BORDER=1 WIDTH=200>
<CAPTION><TT>&lt;TABLE BORDER=1 WIDTH=200&gt;</TT></CAPTION>
<TR><TD>This<TD>is<TR><TD>a<TD>table blah blah blah blah blah blah
</TABLE>
<P>
<TABLE BORDER=1 HEIGHT=200>
<CAPTION><TT>&lt;TABLE BORDER=1 HEIGHT=200&gt;</TT></CAPTION>
<TR><TD>This<TD>is<TR><TD>a<TD>table blah blah blah blah blah blah
</TABLE>
<P>
<TABLE BORDER=1 HEIGHT="25%">
<CAPTION><TT>&lt;TABLE BORDER=1 HEIGHT="25%"&gt;</TT></CAPTION>
<TR><TD>This<TD>is<TR><TD>a<TD>table blah blah blah blah blah blah
</TABLE>
</UL>
<A NAME="tablea"></A>
<H3>Table Alignment</H3>
<UL>
<TABLE BORDER=1>
<CAPTION><TT>&lt;TABLE BORDER=1&gt;</TT></CAPTION>
<TR><TD>This<TD>is<TR><TD>a<TD>table blah blah blah blah blah blah blah blah
</TABLE>
This text follows the &lt;/TABLE&gt; tag.
This text should not flow around the table because the table is neither left- or right-ALIGNed.
This text should not flow around the table because the table is neither left- or right-ALIGNed.
<BR CLEAR=all>
<P>
<TABLE BORDER=1 ALIGN=right>
<CAPTION><TT>&lt;TABLE BORDER=1 ALIGN=right&gt;</TT></CAPTION>
<TR><TD>This<TD>is<TR><TD>a<TD>table blah blah blah blah blah blah blah blah
</TABLE>
This text follows the &lt;/TABLE&gt; tag.
This text should flow around the right-aligned table.
This text should flow around the right-aligned table.
This text should flow around the right-aligned table.
This text should flow around the right-aligned table.
This text should flow around the right-aligned table.
This text should flow around the right-aligned table.
This text should flow around the right-aligned table.
This text should flow around the right-aligned table.
<BR CLEAR=all>
<P>
<TABLE BORDER=1 ALIGN=left>
<CAPTION><TT>&lt;TABLE BORDER=1 ALIGN=left&gt;</TT></CAPTION>
<TR><TD>This<TD>is<TR><TD>a<TD>table blah blah blah blah blah blah blah blah
</TABLE>
This text follows the &lt;/TABLE&gt; tag.
This text should flow around the left-aligned table.
This text should flow around the left-aligned table.
This text should flow around the left-aligned table.
This text should flow around the left-aligned table.
This text should flow around the left-aligned table.
This text should flow around the left-aligned table.
This text should flow around the left-aligned table.
This text should flow around the left-aligned table.
<BR CLEAR=all>
</UL>
<A NAME="horiza"></A>
<H3>Horizontal Cell Alignment</H3>
<UL>
<TABLE BORDER=1>
<TH>This is a <TT>&lt;TH&gt;</TT> Table Heading
<TR><TH ALIGN=left>This is a <TT>&lt;TH ALIGN=left&gt;</TT> Table Heading
<TR><TH ALIGN=right>This is a <TT>&lt;TH ALIGN=right&gt;</TT> Table Heading
<TR><TD>This is <TT>&lt;TD&gt;</TT> Table Data that is long to expand the table horizontally.
<TR><TD>This is <TT>&lt;TD&gt;</TT> Table Data
<TR><TD ALIGN=right>This is <TT>&lt;TD ALIGN=right&gt;</TT> Table Data
<TR><TD ALIGN=center>This is <TT>&lt;TD ALIGN=center&gt;</TT> Table Data
</TABLE>
</UL>
<A NAME="vertia"></A>
<H3>Vertical Cell Alignment</H3>
<UL>
<TABLE BORDER=1>
<TR>
<TD><FONT SIZE="+4">
Some text.<BR>
Some text.</FONT>
<TD VALIGN=top><TT>&lt;TD VALIGN=top&gt;</TT>
<TD VALIGN=baseline><TT>&lt;TD VALIGN=baseline&gt;</TT>
<TR>
<TD>
This is some text repeated a bunch of times.
This is some text repeated a bunch of times.
This is some text repeated a bunch of times.
This is some text repeated a bunch of times.
This is some text repeated a bunch of times.
<TD VALIGN=middle><TT>&lt;TD VALIGN=middle&gt;</TT>
<TD VALIGN=bottom><TT>&lt;TD VALIGN=bottom&gt;</TT>
</TABLE>
</UL>
<BR CLEAR=all>
<A NAME="cellspa"></A>
<H3>Cell Spacing &amp; Padding</H3>
<UL>
<TABLE BORDER=1>
<CAPTION><TT>&lt;TABLE BORDER=1&gt;</TT></CAPTION>
<TR><TD>This<TD>is<TR><TD>a<TD>table blah blah blah blah blah blah blah blah
</TABLE>
<P>
<TABLE BORDER=1 CELLSPACING=16>
<CAPTION><TT>&lt;TABLE BORDER=1 CELLSPACING=16&gt;</TT></CAPTION>
<TR><TD>This<TD>is<TR><TD>a<TD>table blah blah blah blah blah blah blah blah
</TABLE>
<P>
<TABLE BORDER=1 CELLPADDING=16>
<CAPTION><TT>&lt;TABLE BORDER=1 CELLPADDING=16&gt;</TT></CAPTION>
<TR><TD>This<TD>is<TR><TD>a<TD>table blah blah blah blah blah blah blah blah
</TABLE>
<P>
<TABLE BORDER=1 CELLSPACING=16 CELLPADDING=16>
<CAPTION><TT>&lt;TABLE BORDER=1 CELLSPACING=16 CELLPADDING=16&gt;</TT></CAPTION>
<TR><TD>This<TD>is<TR><TD>a<TD>table blah blah blah blah blah blah blah blah
</TABLE>
</UL>
<A NAME="colwidth"></A>
<H3>Column Width</H3>
<UL>
<TABLE BORDER=1>
<CAPTION>Percentages</CAPTION>
<TR>
<TD WIDTH="75%"><TT>&lt;TD WIDTH="75%"&gt;</TT>
<TD WIDTH="25%"><TT>&lt;TD WIDTH="25%"&gt;</TT>
</TABLE>
<P>
<TABLE BORDER=1>
<CAPTION>Pixels</CAPTION>
<TR>
<TD WIDTH=200><TT>&lt;TD WIDTH=200&gt;</TT>
<TD WIDTH=50><TT>&lt;TD WIDTH=50&gt;</TT>
</TABLE>
</UL>
<A NAME="nowrap"></A>
<H3>NOWRAP</H3>
<UL>
<TABLE BORDER=1>
<CAPTION>Without NOWRAP</CAPTION>
<TR>
<TH><TT>&lt;TD&gt;</TT> below
<TH><TT>&lt;TD&gt;</TT> below
<TR>
<TD>blah blah blah blah blah blah blah blah blah blah blah blah blah blah
<TD>blah blah blah blah blah blah blah blah blah blah blah blah blah blah
</TABLE>
<P>
<TABLE BORDER=1>
<CAPTION>With NOWRAP</CAPTION>
<TR>
<TH><TT>&lt;TD&gt;</TT> below
<TH><TT>&lt;TD NOWRAP&gt;</TT> below
<TR>
<TD>blah blah blah blah blah blah blah blah blah blah blah blah blah blah
<TD NOWRAP>blah blah blah blah blah blah blah blah blah blah blah blah blah blah
</TABLE>
</UL>
<A NAME="tabspan"></A>
<H3>Row/Column Span</H3>
<UL>
<TABLE BORDER=1>
<CAPTION>This is a <TT>&lt;CAPTION&gt;</TT> Caption</CAPTION>
<TH COLSPAN=3>This is a <TT>&lt;TH COLSPAN=3&gt;</TT> Table Heading
<TR>
<TD ROWSPAN=2>This is <TT>&lt;TD ROWSPAN=2&gt;</TT> Table Data
<TD>This is <TT>&lt;TD&gt;</TT> Table Data
<TD>This is <TT>&lt;TD&gt;</TT> Table Data
<TR>
<TD COLSPAN=2>This is <TT>&lt;TD COLSPAN=2&gt;</TT> Table Data
</TABLE>
<P>The table above is coded as:<P>
<TT>&lt;TABLE BORDER=1&gt;
<BR>&lt;CAPTION&gt;This is ...&lt;/CAPTION&gt;
<BR>&lt;TH COLSPAN=3&gt;This is ...
<BR>&lt;TR&gt;
<BR>&lt;TD ROWSPAN=2&gt;This is ...
<BR>&lt;TD&gt;This is ...
<BR>&lt;TD&gt;This is ...
<BR>&lt;TR&gt;
<BR>&lt;TD COLSPAN=2&gt;This is ...
<BR>&lt;/TABLE&gt;
</TT>
</UL>
</UL>
<A NAME="rules"></A>
<H2>Horizontal Rules</H2>
<UL>
<TT>&lt;HR&gt;</TT><HR>
<TT>&lt;HR WIDTH="75%"&gt;</TT><HR WIDTH="75%">
<TT>&lt;HR WIDTH="50%" ALIGN=left&gt;</TT><HR WIDTH="50%" ALIGN=left>
<TT>&lt;HR WIDTH="50%" ALIGN=right&gt;</TT><HR WIDTH="50%" ALIGN=right>
<TT>&lt;HR SIZE=1&gt;</TT><HR SIZE=1>
<TT>&lt;HR SIZE=1 NOSHADE&gt;</TT><HR SIZE=1 NOSHADE>
<TT>&lt;HR SIZE=2&gt;</TT><HR SIZE=2>
<TT>&lt;HR SIZE=2 NOSHADE&gt;</TT><HR SIZE=2 NOSHADE>
<TT>&lt;HR SIZE=4&gt;</TT><HR SIZE=4>
<TT>&lt;HR SIZE=4 NOSHADE&gt;</TT><HR SIZE=4 NOSHADE>
<TT>&lt;HR SIZE=8&gt;</TT><HR SIZE=8>
<TT>&lt;HR SIZE=8 NOSHADE&gt;</TT><HR SIZE=8 NOSHADE>
<TT>&lt;HR SIZE=16&gt;</TT><HR SIZE=16>
<TT>&lt;HR SIZE=16 NOSHADE&gt;</TT><HR SIZE=16 NOSHADE>
</UL>
<A NAME="links"></A>
<H2>Links and Anchors</H2>
<UL>
Use <TT>&lt;A HREF=...&gt;</TT> to hyperlink to another page.
The following line is coded as:
<BR>
<TT>See my &lt;A HREF="index.html"&gt;home page&lt;/A&gt; for details.</TT>
<P>
<UL>
See my <A HREF="index.html">home page</A> for details.
</UL>
<P>
You can jump to somewhere else on the current page by first defining an "anchor":
<BR>
<TT>&lt;A NAME="colors"&gt;&lt;/A&gt;</TT>
<BR>
and then specifying that anchor in the link:
<BR>
<TT>See &lt;A HREF="#colors"&gt;Colors&lt;/A&gt; above.</TT>
<P>
<UL>
See <A HREF="#colors">Colors</A> above.
</UL>
<P>
Or you can jump into the middle of another page by combining a URL and an "anchor":
<BR>
<TT>See &lt;A HREF="aplinfo.html#stschist"&gt;STSC History&lt;/A&gt;.</TT>
<P>
<UL>
See <A HREF="aplinfo.html#stschist">STSC History</A>.
</UL>
</UL>
<A NAME="forms"></A>
<H2>Forms</H2>
<UL>
<FORM METHOD=post ACTION="mailto:rex@example.com">
The easiest way to submit a form is via e-mail.
This demonstration form is coded as:
<P>
<TT>&lt;FORM METHOD=post ACTION="mailto:rex@example.com"&gt;</TT>
<BR>
... form elements ...
<BR>
<TT>&lt;/FORM&gt;</TT>
<P>
The alternative is to have the form invoke a CGI program,
which would be coded as either:
<P>
<TT>&lt;FORM METHOD=get&nbsp; ACTION="http://www.example.com/foo.cgi"&gt;</TT>
<BR>
or:
<BR>
<TT>&lt;FORM METHOD=post ACTION="http://www.example.com/foo.cgi"&gt;</TT>
<P>
The <TT>get</TT> method sends the <TT>name=value</TT> pairs along with the
specified URL -- the user would see something like
<TT>http://www.example.com/foo.cgi?first=Rex&amp;last=Swain</TT> as foo.cgi was invoked,
and (if written in Perl) foo.cgi would receive
<TT>GET</TT> via <TT>$ENV{'REQUEST_METHOD'}</TT>
and <TT>first=Rex&amp;last=Swain</TT> via <TT>$ENV{'QUERY_STRING'}</TT>.
<P>
The <TT>post</TT> method sends the <TT>name=value</TT> pairs via STDIN (standard
input) -- the user would see something like
<TT>http://www.example.com/foo.cgi</TT> as foo.cgi was invoked,
and (if written in Perl) foo.cgi would receive
<TT>POST</TT> via <TT>$ENV{'REQUEST_METHOD'}</TT>
and the length of the standard input via <TT>$ENV{'CONTENT_LENGTH'}</TT>
and <TT>first=Rex&amp;last=Swain</TT> via <TT>STDIN</TT>.
<A NAME="ftext"></A>
<H3>Text Elements</H3>
<UL>
Here is an <TT>&lt;INPUT TYPE="text" SIZE=30 NAME="name1"&gt;</TT> element:
<P><UL>
Enter your name:<BR>
<INPUT TYPE="text" SIZE=30 NAME="name">
</UL><P>
Here is an <TT>&lt;INPUT TYPE="text" SIZE=30 NAME="name2" VALUE="Initialize Me"&gt;</TT> element:
<P><UL>
Enter your name:<BR>
<INPUT TYPE="text" SIZE=30 NAME="init" VALUE="Initialize Me">
</UL><P>
Here is an <TT>&lt;INPUT TYPE="text" SIZE=20 MAXLENGTH=10 NAME="short"&gt;</TT> element:
<P><UL>
Enter something up to 10 characters long:<BR>
<INPUT TYPE="text" SIZE=20 MAXLENGTH=10 NAME="short">
</UL><P>
Here is an <TT>&lt;INPUT TYPE="password" SIZE=8 NAME="pw"&gt;</TT> element:
<P><UL>
Guess the secret word:<BR>
<INPUT TYPE="password" SIZE=8 NAME="pw">
<I>Any characters typed here appear as asterisks</I>
</UL><P>
This is a <TT>&lt;TEXTAREA ROWS=3 COLS=40 NAME="comment1"&gt;&lt;/TEXTAREA&gt;</TT> element:
<P><UL>
Your comments, please:<BR>
<TEXTAREA ROWS=3 COLS=40 NAME="comment1"></TEXTAREA>
</UL><P>
This is a <TT>&lt;TEXTAREA ROWS=2 COLS=40 NAME="comment2"&gt;Initialize Me&lt;/TEXTAREA&gt;</TT> element:
<P><UL>
Your comments, please:<BR>
<TEXTAREA ROWS=2 COLS=40 NAME="comment2">Initialize Me</TEXTAREA>
</UL><P>
This is a <TT>&lt;TEXTAREA ROWS=2 COLS=25 WRAP=soft NAME="comment3"&gt;</TT> element:
<P><UL>
<TEXTAREA ROWS=2 COLS=25 WRAP=soft NAME="comment3"></TEXTAREA>
<P>
<UL>
<LI><TT>WRAP=off</TT> (the default) disables word wrap. Text the user types is
displayed and returned exactly as typed.
<LI><TT>WRAP=hard</TT> or <TT>WRAP=physical</TT> cause word wrap, and the line
breaks are included when the form is submitted.
<LI><TT>WRAP=soft</TT> or <TT>WRAP=virtual</TT> cause word wrap, but the line breaks
are not included when the form is submitted.
</UL><P>
Regardless of the WRAP parameter, whenever the user <I>explicitly</I> inserts a
line break, a CR/LF pair (<TT>%0D%0A</TT>) is returned embedded in the text.
</UL><P>
</UL>
<A NAME="fradio"></A>
<H3>Radio Buttons</H3>
<UL>
Here are two <TT>&lt;INPUT TYPE="radio"&gt;</TT> elements:
<P>
<TT>
&lt;INPUT TYPE="radio" NAME="sex" VALUE="M" CHECKED&gt;Male
<BR>
&lt;INPUT TYPE="radio" NAME="sex" VALUE="F"&gt;Female
</TT>
<P><UL>
What gender are you?<BR>
<INPUT TYPE="radio" NAME="sex" VALUE="M" CHECKED>Male
<BR>
<INPUT TYPE="radio" NAME="sex" VALUE="F">Female
</UL><P>
Note that you use the same <TT>NAME</TT> parameter for a group of buttons.
If one button has a <TT>CHECKED</TT> option, it will be selected by default.
If the form is submitted as is, <TT>sex=M</TT> would be sent.
</UL>
<A NAME="fcheck"></A>
<H3>Checkboxes</H3>
<UL>
Here are three <TT>&lt;INPUT TYPE="checkbox"&gt;</TT> elements:
<P>
<TT>
&lt;INPUT TYPE="checkbox" NAME="tv" CHECKED&gt;TV
<BR>
&lt;INPUT TYPE="checkbox" NAME="vcr" CHECKED&gt;VCR
<BR>
&lt;INPUT TYPE="checkbox" NAME="cd"&gt;CD Player
</TT>
<P><UL>
Which of the following do you own?<BR>
<INPUT TYPE="checkbox" NAME="tv" CHECKED>TV
<BR>
<INPUT TYPE="checkbox" NAME="vcr" CHECKED>VCR
<BR>
<INPUT TYPE="checkbox" NAME="cd">CD Player
</UL><P>
Note that you use different <TT>NAME</TT> parameters for each checkbox.
Any checkboxes that have a <TT>CHECKED</TT> option will be selected by default.
If the form is submitted as is, <TT>tv=on&amp;vcr=on</TT> would be sent.
</UL>
<A NAME="fselect"></A>
<H3>Selection Lists</H3>
<UL>
This is a <TT>&lt;SELECT&gt;</TT> element
with 5 <TT>&lt;OPTION&gt;</TT> elements:
<P>
<TT>&lt;SELECT NAME="country"&gt;
<BR>&lt;OPTION SELECTED&gt;USA
<BR>&lt;OPTION&gt;France
<BR>&lt;OPTION&gt;Germany
<BR>&lt;OPTION&gt;United Kingdom
<BR>&lt;OPTION&gt;Other
<BR>&lt;/SELECT&gt;
</TT>
<P><UL>
Where are you?<BR>
<SELECT NAME="country">
<OPTION SELECTED>USA
<OPTION>France
<OPTION>Germany
<OPTION>United Kingdom
<OPTION>Other
</SELECT>
</UL><P>
Note that this appears as a drop-down selection box, and
you may select only one item.
<P>
Here's the same sort of thing with <TT>SIZE=4</TT>
and <TT>MULTIPLE</TT> options added:
<P>
<TT>&lt;SELECT SIZE=4 MULTIPLE NAME="os"&gt;
<BR>&lt;OPTION&gt;DOS
<BR>&lt;OPTION SELECTED&gt;Windows 3.1
<BR>&lt;OPTION&gt;Windows 95
<BR>&lt;OPTION SELECTED&gt;OS/2
<BR>&lt;OPTION&gt;Other
<BR>&lt;/SELECT&gt;
</TT>
<P><UL>
What operating systems have you ever used?<BR>
<SELECT SIZE=4 MULTIPLE NAME="os">
<OPTION>DOS
<OPTION SELECTED>Windows 3.1
<OPTION>Windows 95
<OPTION SELECTED>OS/2
<OPTION>Other
</SELECT>
</UL><P>
Note that this appears as a scrolling selection box, and
you may select several items.
</UL>
<A NAME="fhidden"></A>
<H3>Hidden Fields</H3>
<UL>
Here is an <TT>&lt;INPUT TYPE="hidden" NAME="Hidden" VALUE="Invisible"&gt;</TT>
element:
<P><UL>
<INPUT TYPE="hidden" NAME="Hidden" VALUE="Invisible">
</UL><P>
You will not see anything, but when the form is submitted,
<TT>Hidden=Invisible</TT> will be sent.
</UL>
<A NAME="fsubmit"></A>
<H3>Submit/Reset Buttons</H3>
<UL>
Here are vanilla Submit and Reset buttons:
<P>
<TT>&lt;INPUT TYPE="submit"&gt;
<BR>&lt;INPUT TYPE="reset"&gt;
</TT>
<P><UL>
<INPUT TYPE="submit">
<INPUT TYPE="reset">
</UL><P>
<TT>Submit</TT> submits the form
(i.e., sends the form to the URL specified in the form's <TT>ACTION</TT> attribute).
<TT>Reset</TT> restores all form elements to their default values.
<P>
You may change the text on the button faces by
specifying <TT>VALUE=</TT> parameters:
<P>
<TT>&lt;INPUT TYPE="submit" VALUE="Send!"&gt;
<BR>&lt;INPUT TYPE="reset" VALUE="Clear Form"&gt;
</TT>
<P><UL>
<INPUT TYPE="submit" VALUE="Send!">
<INPUT TYPE="reset" VALUE="Clear Form">
</UL><P>
Here is an <TT>&lt;INPUT TYPE="image" SRC="undercon.gif"&gt;</TT> element:
<P><UL>
<INPUT TYPE="image" SRC="undercon.gif">
</UL><P>
This acts like a Submit button.
</UL>
</FORM>
</UL>
<A NAME="images"></A>
<H2>Images</H2>
<UL>
<A NAME="imagev"></A>
<H3>Vertical Image Alignment</H3>
<UL>
<TABLE BORDER=1>
<TR><TD><TT>&lt;IMG SRC="undercon.gif"&gt;</TT>
<TD>This is <IMG SRC="undercon.gif">
some text with no long words: is is is is is is is is is is
is is is is is is is is is is is is is is is is is is is is is is is.
</TD></TR>
<TR><TD><TT>&lt;IMG SRC="undercon.gif" ALIGN=bottom&gt;</TT>
<BR>Aligns bottom of image with <I>baseline</I> of line
<TD>This is <IMG SRC="undercon.gif" ALIGN=bottom>
some text with no long words: is is is is is is is is is is
is is is is is is is is is is is is is is is is is is is is is is is.
<TR><TD><TT>&lt;IMG SRC="undercon.gif" ALIGN=baseline&gt;</TT>
<BR>Aligns bottom of image with <I>baseline</I> of line
(same as ALIGN=bottom)
<TD>This is <IMG SRC="undercon.gif" ALIGN=baseline>
some text with no long words: is is is is is is is is is is
is is is is is is is is is is is is is is is is is is is is is is is.
<TR><TD><TT>&lt;IMG SRC="undercon.gif" ALIGN=absbottom&gt;</TT>
<BR>Aligns bottom of image with lowest <I>item</I> on line
<TD>This is <IMG SRC="undercon.gif" ALIGN=absbottom>
some text with no long words: is is is is is is is is is is
is is is is is is is is is is is is is is is is is is is is is is is.
<TR><TD><TT>&lt;IMG SRC="undercon.gif" ALIGN=middle&gt;</TT>
<BR><I>Aligns middle of image with baseline of text</I>
<TD>This is <IMG SRC="undercon.gif" ALIGN=middle>
some text with no long words: is is is is is is is is is is
is is is is is is is is is is is is is is is is is is is is is is is.
<TR><TD><TT>&lt;IMG SRC="undercon.gif" ALIGN=absmiddle&gt;</TT>
<BR><I>Aligns middle of image with middle of text</I>
<TD>This is <IMG SRC="undercon.gif" ALIGN=absmiddle>
some text with no long words: is is is is is is is is is is
is is is is is is is is is is is is is is is is is is is is is is is.
</TD></TR>
<TR><TD><TT>&lt;IMG SRC="undercon.gif" ALIGN=top&gt;</TT>
<BR>Aligns top of image with tallest <I>item</I> on line
<TD>This is <IMG SRC="undercon.gif" ALIGN=top>
some text with no long words: is is is is is is is is is is
is is is is is is is is is is is is is is is is is is is is is is is.
<TR><TD><TT>&lt;IMG SRC="undercon.gif" ALIGN=texttop&gt;</TT>
<BR>Aligns top of image with tallest <I>text</I> on line
<TD>This is <IMG SRC="undercon.gif" ALIGN=texttop>
some text with no long words: is is is is is is is is is is
is is is is is is is is is is is is is is is is is is is is is is is.
</TABLE>
</UL>
<A NAME="imageh"></A>
<H3>Horizontal Image Alignment</H3>
<UL>
<TABLE BORDER=1>
<TR><TD><TT>&lt;IMG SRC="undercon.gif" ALIGN=right&gt;</TT>
<TD><IMG SRC="undercon.gif" ALIGN=right>
This is some text with no long words: is is is is is is is is is is
is is is is is is is is is is is is is is is is is is is is is is is
is is is is is is is is is is is is is is is is is is is is is is is
is is is is is is is is is is is is is is is is is is is is is is is
is is is is is is is is is is is is is is is is is is is is is is is
is is is is is is is is is is is is is is is is is is is is is is is
is is is is is is is is is is is is is is is is is is is is is is is.
<TR><TD><TT>&lt;IMG SRC="undercon.gif" ALIGN=left&gt;</TT>
<TD><IMG SRC="undercon.gif" ALIGN=left>
This is some text with no long words: is is is is is is is is is is
is is is is is is is is is is is is is is is is is is is is is is is
is is is is is is is is is is is is is is is is is is is is is is is
is is is is is is is is is is is is is is is is is is is is is is is
is is is is is is is is is is is is is is is is is is is is is is is
is is is is is is is is is is is is is is is is is is is is is is is
is is is is is is is is is is is is is is is is is is is is is is is.
<TR><TD><TT>&lt;IMG SRC="undercon.gif" ALIGN=left&gt;</TT>
<BR>and<BR><TT>&lt;IMG SRC="undercon.gif" ALIGN=right&gt;</TT>
<TD><IMG SRC="undercon.gif" ALIGN=left><IMG SRC="undercon.gif" ALIGN=right>
This is some text with no long words: is is is is is is is is is is
is is is is is is is is is is is is is is is is is is is is is is is
is is is is is is is is is is is is is is is is is is is is is is is
is is is is is is is is is is is is is is is is is is is is is is is
is is is is is is is is is is is is is is is is is is is is is is is
is is is is is is is is is is is is is is is is is is is is is is is
is is is is is is is is is is is is is is is is is is is is is is is.
</TABLE>
</UL>
<A NAME="imageb"></A>
<H3>Image Space &amp; Border</H3>
<UL>
<TABLE BORDER=1>
<TR><TD><TT>&lt;IMG SRC="undercon.gif" ALIGN=left BORDER=1&gt;</TT>
<TD><IMG SRC="undercon.gif" ALIGN=left BORDER=1>
This is some text with no long words: is is is is is is is is is is
is is is is is is is is is is is is is is is is is is is is is is is
is is is is is is is is is is is is is is is is is is is is is is is
is is is is is is is is is is is is is is is is is is is is is is is
is is is is is is is is is is is is is is is is is is is is is is is
is is is is is is is is is is is is is is is is is is is is is is is
is is is is is is is is is is is is is is is is is is is is is is is.
<TR><TD><TT>&lt;IMG SRC="undercon.gif" ALIGN=left VSPACE=16 HSPACE=32 BORDER=4&gt;</TT>
<TD><IMG SRC="undercon.gif" ALIGN=left VSPACE=16 HSPACE=32 BORDER=4>
This is some text with no long words: is is is is is is is is is is
is is is is is is is is is is is is is is is is is is is is is is is
is is is is is is is is is is is is is is is is is is is is is is is
is is is is is is is is is is is is is is is is is is is is is is is
is is is is is is is is is is is is is is is is is is is is is is is
is is is is is is is is is is is is is is is is is is is is is is is
is is is is is is is is is is is is is is is is is is is is is is is.
</TABLE>
</UL>
<A NAME="imalt"></A>
<H3>Image Alternate Text</H3>
<UL>
<TABLE BORDER=1>
<TR><TD><TT>&lt;IMG SRC="nosuch.gif"&gt;</TT>
<TD><IMG SRC="nosuch.gif">
This is some text.
<TR><TD><TT>&lt;IMG SRC="nosuch.gif" ALT="Ooops"&gt;</TT>
<BR><I>Try this with Netscape's "Auto Load Images"<BR>option turned off</I>
<TD><IMG SRC="nosuch.gif" ALT="Ooops">
This is some text.
</TABLE>
</UL>
<A NAME="imsize"></A>
<H3>Image Size &amp; Scale</H3>
<UL>
<TABLE BORDER=1>
<TR><TD><TT>&lt;IMG SRC="undercon.gif"&gt;</TT>
<BR><I>Image size unknown until browser retrieves file</I>
<TD><IMG SRC="undercon.gif">
<TR><TD><TT>&lt;IMG SRC="undercon.gif" WIDTH=40 HEIGHT=40&gt;</TT>
<BR><I>Browser can allocate space before file is retrieved</I>
<TD><IMG SRC="undercon.gif" WIDTH=40 HEIGHT=40>
<TR><TD><TT>&lt;IMG SRC="undercon.gif" WIDTH=80 HEIGHT=80&gt;</TT>
<BR><I>Browser scales image to specified size</I>
<TD><IMG SRC="undercon.gif" WIDTH=80 HEIGHT=80>
<TR><TD><TT>&lt;IMG SRC="undercon.gif" WIDTH=20 HEIGHT=20&gt;</TT>
<BR><I>Browser scales image to specified size</I>
<TD><IMG SRC="undercon.gif" WIDTH=20 HEIGHT=20>
<TR><TD><TT>&lt;IMG SRC="undercon.gif" WIDTH=20 HEIGHT=80&gt;</TT>
<BR><I>Browser scales image to specified size</I>
<TD><IMG SRC="undercon.gif" WIDTH=20 HEIGHT=80>
</TABLE>
</UL>
<A NAME="inimages"></A>
<H3>Internal Images</H3>
<UL>
Netscape 1.22 and 2.01 support these internal images:
<P>
<TABLE BORDER=0>
<TR><!-- <TD><IMG SRC="internal-gopher-binary" ></TD> --><TD><TT>&lt;IMG SRC="internal-gopher-binary"&gt; </TT><TD>page with 0's and 1's</TD>
<TR><!-- <TD><IMG SRC="internal-gopher-index" ></TD> --><TD><TT>&lt;IMG SRC="internal-gopher-index"&gt; </TT><TD>binoculars</TD>
<TR><!-- <TD><IMG SRC="internal-gopher-image" ></TD> --><TD><TT>&lt;IMG SRC="internal-gopher-image"&gt; </TT><TD>page with symbols</TD>
<TR><!-- <TD><IMG SRC="internal-gopher-menu" ></TD> --><TD><TT>&lt;IMG SRC="internal-gopher-menu"&gt; </TT><TD>file folder</TD>
<TR><!-- <TD><IMG SRC="internal-gopher-movie" ></TD> --><TD><TT>&lt;IMG SRC="internal-gopher-movie"&gt; </TT><TD>strip of film</TD>
<TR><!-- <TD><IMG SRC="internal-gopher-sound" ></TD> --><TD><TT>&lt;IMG SRC="internal-gopher-sound"&gt; </TT><TD>page with speaker</TD>
<TR><!-- <TD><IMG SRC="internal-gopher-text" ></TD> --><TD><TT>&lt;IMG SRC="internal-gopher-text"&gt; </TT><TD>page with text</TD>
<TR><!-- <TD><IMG SRC="internal-gopher-telnet" ></TD> --><TD><TT>&lt;IMG SRC="internal-gopher-telnet"&gt; </TT><TD>PC icon</TD>
<TR><!-- <TD><IMG SRC="internal-gopher-unknown"></TD> --><TD><TT>&lt;IMG SRC="internal-gopher-unknown"&gt;</TT><TD>blank page</TD>
</TABLE>
<P>
<FONT SIZE=-1>(Try these on your own server -- each view of this page generated 9 records in
my server's error log.<BR>RHS 26 July 1999)</FONT>
</UL> <!-- q -->
<A NAME="csim"></A>
<H3>Client-Side Image Maps</H3>
<UL>
<IMG SRC=rexc.gif WIDTH=168 HEIGHT=221 USEMAP="#csimap" ALIGN=right>
<MAP NAME="csimap">
<AREA SHAPE="rect" HREF="GOTOTOP.html" COORDS="0,0,167,110">
<AREA SHAPE="rect" HREF="GOTOBOTTOM.html" COORDS="0,111,167,220">
</MAP>
Pass your mouse over the picture and keep an eye on your browser's status line.
<P>
If your browser supports client-side image maps, you should see a reference
to GOTOTOP while over the top half of the picture, and GOTOBOTTOM while over the
bottom half.
(These links are not active, so if you actually click on the picture,
you'll get an error message saying that the link cannot be found.)
<P>
If your browser does not support client-side image maps, if you click on the
picture, nothing will happen.
<P>
<BR CLEAR=right>
<P>
The HTML code for this is:
<PRE>
&lt;IMG SRC=rexc.gif WIDTH=168 HEIGHT=221 USEMAP="#csimap" ALIGN=right&gt;
&lt;MAP NAME="csimap"&gt;
&lt;AREA SHAPE="rect" HREF="GOTOTOP.html" COORDS="0,0,167,110"&gt;
&lt;AREA SHAPE="rect" HREF="GOTOBOTTOM.html" COORDS="0,111,167,220"&gt;
&lt;/MAP&gt;
Blah blah blah
</PRE>
</UL>
<A NAME="bgimage"></A>
<H3>Background Image</H3>
<UL>
A background image may be specified as an option in the &lt;BODY&gt; tag,
as follows:
<P>
<TT>&lt;BODY BACKGROUND="path/filename.gif"&gt;</TT>
<P>
(Personally, I think that the use of this feature is just about as obnoxious
as &lt;BLINK&gt;!)
</UL>
<A NAME="figure"></A>
<H3>Figure Element</H3>
<UL>
<IMG SRC="n2x.gif" ALIGN=left>&lt;FIG&gt; is an HTML3 feature.
If no image appears, your browser does not support figures.
FYI, Netscape 2.01 does not support figures.
<P>
<FIG SRC="rexc.gif" WIDTH=168 HEIGHT=221 ALIGN=right>
<OVERLAY SRC="undercon.gif" WIDTH=40 HEIGHT=40 X=64 Y=80>
<CAPTION>This is the caption.</CAPTION>
This is a figure (&lt;FIG ALIGN=right&gt;) element
with &lt;CAPTION&gt; and &lt;CREDIT&gt; and &lt;OVERLAY&gt; tags.
You should see a photo of me with the under-construction icon overlaid in its center.
<CREDIT>This is the credit.</CREDIT>
</FIG>
<BR CLEAR=all>
<P>
The HTML code for this is:
<PRE>
&lt;FIG SRC="rexc.gif" WIDTH=168 HEIGHT=221 ALIGN=right&gt;
&lt;OVERLAY SRC="undercon.gif" WIDTH=40 HEIGHT=40 X=64 Y=80&gt;
&lt;CAPTION&gt;This is the caption.&lt;/CAPTION&gt;
Blah blah blah
&lt;CREDIT&gt;This is the credit.&lt;/CREDIT&gt;
&lt;/FIG&gt;
</PRE>
Thanks to <A HREF="http://www.laronson.com">Larry Aronson</A> (author of
<CITE>HTML3 Manual of Style</CITE>)
for information on this.
</UL>
</UL>
<A NAME="chars"></A>
<H2>Character Entities</H2>
<UL>
The chart below was lifted from
Martin Ramsch's
<STRONG>ISO8859-1 Table</STRONG>
<PRE>
Description Code Entity name
=================================== ============ ==============
quotation mark &amp;#34; --&gt; &#34; &amp;quot; --&gt; &quot;
ampersand &amp;#38; --&gt; &#38; &amp;amp; --&gt; &amp;
less-than sign &amp;#60; --&gt; &#60; &amp;lt; --&gt; &lt;
greater-than sign &amp;#62; --&gt; &#62; &amp;gt; --&gt; &gt;
Description Char Code Entity name
=================================== ==== ============ ==============
non-breaking space   &amp;#160; --&gt; &#160; &amp;nbsp; --&gt; &nbsp;
inverted exclamation ¡ &amp;#161; --&gt; &#161; &amp;iexcl; --&gt; &iexcl;
cent sign ¢ &amp;#162; --&gt; &#162; &amp;cent; --&gt; &cent;
pound sterling £ &amp;#163; --&gt; &#163; &amp;pound; --&gt; &pound;
general currency sign ¤ &amp;#164; --&gt; &#164; &amp;curren; --&gt; &curren;
yen sign ¥ &amp;#165; --&gt; &#165; &amp;yen; --&gt; &yen;
broken vertical bar ¦ &amp;#166; --&gt; &#166; &amp;brvbar; --&gt; &brvbar;
&amp;brkbar; --&gt; &brkbar;
section sign § &amp;#167; --&gt; &#167; &amp;sect; --&gt; &sect;
umlaut (dieresis) ¨ &amp;#168; --&gt; &#168; &amp;uml; --&gt; &uml;
&amp;die; --&gt; &die;
copyright © &amp;#169; --&gt; &#169; &amp;copy; --&gt; &copy;
feminine ordinal ª &amp;#170; --&gt; &#170; &amp;ordf; --&gt; &ordf;
left angle quote, guillemotleft « &amp;#171; --&gt; &#171; &amp;laquo; --&gt; &laquo;
not sign ¬ &amp;#172; --&gt; &#172; &amp;not; --&gt; &not;
soft hyphen ­ &amp;#173; --&gt; &#173; &amp;shy; --&gt; &shy;
registered trademark ® &amp;#174; --&gt; &#174; &amp;reg; --&gt; &reg;
macron accent ¯ &amp;#175; --&gt; &#175; &amp;macr; --&gt; &macr;
&amp;hibar; --&gt; &hibar;
degree sign ° &amp;#176; --&gt; &#176; &amp;deg; --&gt; &deg;
plus or minus ± &amp;#177; --&gt; &#177; &amp;plusmn; --&gt; &plusmn;
superscript two ² &amp;#178; --&gt; &#178; &amp;sup2; --&gt; &sup2;
superscript three ³ &amp;#179; --&gt; &#179; &amp;sup3; --&gt; &sup3;
acute accent ´ &amp;#180; --&gt; &#180; &amp;acute; --&gt; &acute;
micro sign µ &amp;#181; --&gt; &#181; &amp;micro; --&gt; &micro;
paragraph sign ¶ &amp;#182; --&gt; &#182; &amp;para; --&gt; &para;
middle dot · &amp;#183; --&gt; &#183; &amp;middot; --&gt; &middot;
cedilla ¸ &amp;#184; --&gt; &#184; &amp;cedil; --&gt; &cedil;
superscript one ¹ &amp;#185; --&gt; &#185; &amp;sup1; --&gt; &sup1;
masculine ordinal º &amp;#186; --&gt; &#186; &amp;ordm; --&gt; &ordm;
right angle quote, guillemotright » &amp;#187; --&gt; &#187; &amp;raquo; --&gt; &raquo;
fraction one-fourth ¼ &amp;#188; --&gt; &#188; &amp;frac14; --&gt; &frac14;
fraction one-half ½ &amp;#189; --&gt; &#189; &amp;frac12; --&gt; &frac12;
fraction three-fourths ¾ &amp;#190; --&gt; &#190; &amp;frac34; --&gt; &frac34;
inverted question mark ¿ &amp;#191; --&gt; &#191; &amp;iquest; --&gt; &iquest;
capital A, grave accent À &amp;#192; --&gt; &#192; &amp;Agrave; --&gt; &Agrave;
capital A, acute accent Á &amp;#193; --&gt; &#193; &amp;Aacute; --&gt; &Aacute;
capital A, circumflex accent  &amp;#194; --&gt; &#194; &amp;Acirc; --&gt; &Acirc;
capital A, tilde à &amp;#195; --&gt; &#195; &amp;Atilde; --&gt; &Atilde;
capital A, dieresis or umlaut mark Ä &amp;#196; --&gt; &#196; &amp;Auml; --&gt; &Auml;
capital A, ring Å &amp;#197; --&gt; &#197; &amp;Aring; --&gt; &Aring;
capital AE diphthong (ligature) Æ &amp;#198; --&gt; &#198; &amp;AElig; --&gt; &AElig;
capital C, cedilla Ç &amp;#199; --&gt; &#199; &amp;Ccedil; --&gt; &Ccedil;
capital E, grave accent È &amp;#200; --&gt; &#200; &amp;Egrave; --&gt; &Egrave;
capital E, acute accent É &amp;#201; --&gt; &#201; &amp;Eacute; --&gt; &Eacute;
capital E, circumflex accent Ê &amp;#202; --&gt; &#202; &amp;Ecirc; --&gt; &Ecirc;
capital E, dieresis or umlaut mark Ë &amp;#203; --&gt; &#203; &amp;Euml; --&gt; &Euml;
capital I, grave accent Ì &amp;#204; --&gt; &#204; &amp;Igrave; --&gt; &Igrave;
capital I, acute accent Í &amp;#205; --&gt; &#205; &amp;Iacute; --&gt; &Iacute;
capital I, circumflex accent Î &amp;#206; --&gt; &#206; &amp;Icirc; --&gt; &Icirc;
capital I, dieresis or umlaut mark Ï &amp;#207; --&gt; &#207; &amp;Iuml; --&gt; &Iuml;
capital Eth, Icelandic Ð &amp;#208; --&gt; &#208; &amp;ETH; --&gt; &ETH;
&amp;Dstrok; --&gt; &Dstrok;
capital N, tilde Ñ &amp;#209; --&gt; &#209; &amp;Ntilde; --&gt; &Ntilde;
capital O, grave accent Ò &amp;#210; --&gt; &#210; &amp;Ograve; --&gt; &Ograve;
capital O, acute accent Ó &amp;#211; --&gt; &#211; &amp;Oacute; --&gt; &Oacute;
capital O, circumflex accent Ô &amp;#212; --&gt; &#212; &amp;Ocirc; --&gt; &Ocirc;
capital O, tilde Õ &amp;#213; --&gt; &#213; &amp;Otilde; --&gt; &Otilde;
capital O, dieresis or umlaut mark Ö &amp;#214; --&gt; &#214; &amp;Ouml; --&gt; &Ouml;
multiply sign × &amp;#215; --&gt; &#215; &amp;times; --&gt; &times;
capital O, slash Ø &amp;#216; --&gt; &#216; &amp;Oslash; --&gt; &Oslash;
capital U, grave accent Ù &amp;#217; --&gt; &#217; &amp;Ugrave; --&gt; &Ugrave;
capital U, acute accent Ú &amp;#218; --&gt; &#218; &amp;Uacute; --&gt; &Uacute;
capital U, circumflex accent Û &amp;#219; --&gt; &#219; &amp;Ucirc; --&gt; &Ucirc;
capital U, dieresis or umlaut mark Ü &amp;#220; --&gt; &#220; &amp;Uuml; --&gt; &Uuml;
capital Y, acute accent Ý &amp;#221; --&gt; &#221; &amp;Yacute; --&gt; &Yacute;
capital THORN, Icelandic Þ &amp;#222; --&gt; &#222; &amp;THORN; --&gt; &THORN;
small sharp s, German (sz ligature) ß &amp;#223; --&gt; &#223; &amp;szlig; --&gt; &szlig;
small a, grave accent à &amp;#224; --&gt; &#224; &amp;agrave; --&gt; &agrave;
small a, acute accent á &amp;#225; --&gt; &#225; &amp;aacute; --&gt; &aacute;
small a, circumflex accent â &amp;#226; --&gt; &#226; &amp;acirc; --&gt; &acirc;
small a, tilde ã &amp;#227; --&gt; &#227; &amp;atilde; --&gt; &atilde;
small a, dieresis or umlaut mark ä &amp;#228; --&gt; &#228; &amp;auml; --&gt; &auml;
small a, ring å &amp;#229; --&gt; &#229; &amp;aring; --&gt; &aring;
small ae diphthong (ligature) æ &amp;#230; --&gt; &#230; &amp;aelig; --&gt; &aelig;
small c, cedilla ç &amp;#231; --&gt; &#231; &amp;ccedil; --&gt; &ccedil;
small e, grave accent è &amp;#232; --&gt; &#232; &amp;egrave; --&gt; &egrave;
small e, acute accent é &amp;#233; --&gt; &#233; &amp;eacute; --&gt; &eacute;
small e, circumflex accent ê &amp;#234; --&gt; &#234; &amp;ecirc; --&gt; &ecirc;
small e, dieresis or umlaut mark ë &amp;#235; --&gt; &#235; &amp;euml; --&gt; &euml;
small i, grave accent ì &amp;#236; --&gt; &#236; &amp;igrave; --&gt; &igrave;
small i, acute accent í &amp;#237; --&gt; &#237; &amp;iacute; --&gt; &iacute;
small i, circumflex accent î &amp;#238; --&gt; &#238; &amp;icirc; --&gt; &icirc;
small i, dieresis or umlaut mark ï &amp;#239; --&gt; &#239; &amp;iuml; --&gt; &iuml;
small eth, Icelandic ð &amp;#240; --&gt; &#240; &amp;eth; --&gt; &eth;
small n, tilde ñ &amp;#241; --&gt; &#241; &amp;ntilde; --&gt; &ntilde;
small o, grave accent ò &amp;#242; --&gt; &#242; &amp;ograve; --&gt; &ograve;
small o, acute accent ó &amp;#243; --&gt; &#243; &amp;oacute; --&gt; &oacute;
small o, circumflex accent ô &amp;#244; --&gt; &#244; &amp;ocirc; --&gt; &ocirc;
small o, tilde õ &amp;#245; --&gt; &#245; &amp;otilde; --&gt; &otilde;
small o, dieresis or umlaut mark ö &amp;#246; --&gt; &#246; &amp;ouml; --&gt; &ouml;
division sign ÷ &amp;#247; --&gt; &#247; &amp;divide; --&gt; &divide;
small o, slash ø &amp;#248; --&gt; &#248; &amp;oslash; --&gt; &oslash;
small u, grave accent ù &amp;#249; --&gt; &#249; &amp;ugrave; --&gt; &ugrave;
small u, acute accent ú &amp;#250; --&gt; &#250; &amp;uacute; --&gt; &uacute;
small u, circumflex accent û &amp;#251; --&gt; &#251; &amp;ucirc; --&gt; &ucirc;
small u, dieresis or umlaut mark ü &amp;#252; --&gt; &#252; &amp;uuml; --&gt; &uuml;
small y, acute accent ý &amp;#253; --&gt; &#253; &amp;yacute; --&gt; &yacute;
small thorn, Icelandic þ &amp;#254; --&gt; &#254; &amp;thorn; --&gt; &thorn;
small y, dieresis or umlaut mark ÿ &amp;#255; --&gt; &#255; &amp;yuml; --&gt; &yuml;
</PRE>
</UL>
<P><HR NOSHADE SIZE=4></P>
<CENTER>
You are visitor
<IMG SRC="/cgi-bin/countrex.cgi?sampler" ALIGN=absmiddle WIDTH=90 HEIGHT=20 ALT="[Odometer]">
since 25 March 1996
<P><HR SIZE=1></P>
<B>Sorry, but I do not have time to provide free answers
to questions about HTML.</B><BR>
(I'm busy trying to make a living!) So please don't e-mail your questions to me.
<P><HR SIZE=1></P>
<ADDRESS>
(This is an &lt;ADDRESS&gt; block.)
<BR>
Copyright &copy; 1996-2010 Rex Swain<BR>
E-mail <A HREF="mailto:rex@rexswain.com">rex@rexswain.com</A>,
Web <A HREF="http://www.rexswain.com/index.html">http://www.rexswain.com</A><BR>
Permission granted to distribute unmodified copies
</ADDRESS>
<P><HR SIZE=1></P>
<P>Thanks to <A HREF="http://www.3wventures.com/">3wVentures</A> for supporting this site</P>
</CENTER>
</BODY>
</HTML>