<!--*********************************************************************
* *
* Sample HTML File *
* *
**********************************************************************-->
<!-- Bare Bones File Structure --
-- --
-- <!doctype html public "-//W3C//DTD HTML 3.2 Final//EN"> --
-- <html> --
-- <head> --
-- ... head elements --
-- </head> --
-- <body> --
-- ... document body --
-- </body> --
-- -->
<!-- All HTML 3.2 compliant docs should begin with the !doctype -->
<!doctype html public "-//W3C//DTD HTML 3.2 Final//EN">
<!-- Encloses the entire document -->
<html>
<!-- This is one comment method -->
<comment>This is another method of comment</comment>
<!--*********************************************************************
* *
* Head: *
* *
**********************************************************************-->
<!-- encloses the head of a document -->
<head>
<!-- The title of the document that is used as the window caption -->
<title>Hello World HTML File</title>
<!-- close out the document head -->
</head>
<!--*********************************************************************
* *
* Body: *
* *
**********************************************************************-->
<Body BGCOLOR="WHITE">
<!--*********************************************************************
* *
* Heading Text: *
* *
**********************************************************************-->
<hr><u><b>Headings</b></u><br>
<!-- Up to six levels of heading text may be used -->
<h1> Heading h1 </h1>
<h2> Heading h2 </h2>
<h3> Heading h3 </h3>
<h4> Heading h4 </h4>
<h5> Heading h5 </h5>
<h6> Heading h6 </h6>
<!--*********************************************************************
* *
* Paragraph: *
* *
**********************************************************************-->
<br><hr><br><u><b>Paragraphs</b></u><br>
<!-- Paragraph Definitions -->
<p align=right>Chris Rathman's first paragraph.</p>
<p align=left> Left Alligned paragraph </p>
<p align=center> Center Alligned paragraph </p>
<p align=right> Right Alligned paragraph </p>
<!-- Force Line Break -->
<br>Force a line<br>
break.<br>
<!-- Force Line Break: Stop flowing around any images -->
Move down past floating images on left margin <br clear=left>
Move down past floating images on right margin <br clear=right>
Move down past floating images on either margin <br clear=all>
<!-- Stop the paragraph from wrapping -->
<nobr>This text paragraph should never wrap.</nobr>
<!-- Quotations: Encloses a long quote with both margins indented -->
<blockquote>
<p>
To Be or not to be
that is the question?
</p>
--Bill
</blockquote> <br>
<!-- Preformatted Text -->
<pre>
Chris was here.
And chris was there.
</pre>
<!-- Insert blocks of spaces -->
Spacer begin
<spacer type=Horizontal size=100>Insert space between text
Spacer end.<br>
<!-- Multicolumn Text ??? -->
<multicol cols=2 gutter=10 width=25%>
Column1
Column2
</multicol>
<!--*********************************************************************
* *
* Horizontal Rule: *
* *
**********************************************************************-->
<br><hr><br><u><b>Horizontal Rule</b></u><br>
<hr size=1 width=100%>
<hr size=5 width=50%>
<hr size=5 width=50% noshade>
<hr size=4 width=25% color=red align=left>
<hr size=4 width=25% color=blue align=center>
<hr size=4 width=25% color=green align=right>
<!--*********************************************************************
* *
* Text Formatting: *
* *
**********************************************************************-->
<br><hr><br><u><b>Text Formatting</b></u><br>
<!-- General text formatting -->
<b> Boldface text </b> <br>
<big> Bigger text </big> <br>
<blink> Blink text </blink> <br>
<cite> Citation text </cite> <br>
<code> Code text </code> <br>
<dfn> Definition format text </dfn> <br>
<em> Emphasize text </em> <br>
<i> Italic Text </i> <br>
<kbd> Keyboard Entry text </kbd> <br>
<listing> Listing text </listing> <br>
<s> Strikethrough text </s> <br>
<samp> Sample text </samp> <br>
<small> Smaller text </small> <br>
<strong> Stronger text </strong> <br>
<sub> Subscript text </sub> <br>
<sup> Superscript text </sup> <br>
<tt> Teletype text </tt> <br>
<u> Underline text </u> <br>
<var> Variable text </var> <br><br>
<!--<plaintext> Plain text </plaintext> <br>-->
<!-- Allignment -->
<center> Center text or graphic </center> <br>
<div align=left> Left Allignment </div> <br>
<div align=center> Center Allignment </div> <br>
<div align=right> Right Allignment </div> <br><br>
<!-- Font Size -->
<font size=5> <Font size=+1> Font size ? </font></font><br>
<font size=1> Font size #1 </font> <br>
<font size=2> Font size #2 </font> <br>
<font size=3> Font size #3 </font> <br>
<font size=4> Font size #4 </font> <br>
<font size=5> Font size #5 </font> <br>
<font size=6> Font size #6 </font> <br>
<font size=7> Font size #7 </font> <br><br>
<!-- Font Color -->
<font color=#000000> Black </font> <br>
<font color=#C0C0C0> Silver </font> <br>
<font color=#808080> Gray </font> <br>
<font color=#FFFFFF> White </font> <br>
<font color=#800000> Maroon </font> <br>
<font color=#FF0000> Red </font> <br>
<font color=#800080> Purple </font> <br>
<font color=#FF00FF> Fuchsia </font> <br>
<font color=#00FF00> Green </font> <br>
<font color=#008000> Lime </font> <br>
<font color=#808000> Olive </font> <br>
<font color=#FFFF00> Yellow </font> <br>
<font color=#000080> Navy </font> <br>
<font color=#0000FF> Blue </font> <br>
<font color=#008080> Teal </font> <br>
<font color=#00FFFF> Aqua </font> <br><br>
<!-- Font Type -->
<font face=Arial> Arial </font> <br>
<font face=Courier> Courier </font> <br>
<font face="Times New Roman"> Times New Roman </font> <br>
<font face="Helvetica,Arial"> Helvetica </font> <br><br>
<!--*********************************************************************
* *
* Special Characters: *
* *
**********************************************************************-->
<hr><br><u><b>Special Characters</b></u><br>
<!-- special characters -->
< < <!-- '<' --> <br>
> > <!-- '>' --> <br>
& & <!-- '&' --> <br>
  <!-- nonbreaking space --> <br>
Chris<br>
<!-- foreign characters -->
Æ <br>
ÿ <br><br>
<!--*********************************************************************
* *
* Lists: *
* *
**********************************************************************-->
<hr><br><u><b>Lists</b></u><br>
<!-- Unordered Lists -->
<ul>
<li> Unordered List Item 1
<li> Unordered List Item 2
<li> Unordered List Item 3
</ul>
<!-- Ordered Lists -->
<ol>
<li> Ordered List Item 1
<li> Ordered List Item 2
<li> Ordered List Item 3
</ol>
<ol start="10">
<li> Ordered List Item 1
<li> Ordered List Item 2
<li> Ordered List Item 3
</ol>
<!-- Directory Lists -->
<dir>
<li> Directory List Item 1
<li> Directory List Item 2
<li> Directory List Item 3
</dir>
<!-- Menu Lists -->
<menu>
<li> Menu List Item 1
<li> Menu List Item 2
<li> Menu List Item 3
</menu>
<!-- Bullet types -->
<ul>
<li type="disc"> disc
<li type="circle"> circle
<li type="square"> square
</ul>
<ol>
<li type="A" value="1"> alpha uppercase
<li type="a" value="2"> alpha lowercase
<li type="1" value="3"> numeric
<li type="I" value="4"> roman uppercase
<li type="i" value="5"> roman lowercase
</ol>
<!-- Definition Lists -->
<dl>
<dt> Definition List Data Term 1
<dd> Data Definition
<dt> Definition List Data Term 2
<dd> Data Definition
</dl>
<!-- Definition Lists With Compact Option -->
<dl COMPACT>
<dt> -A
<dd> Option #A
<dt> -Z
<dd> Option #Z
</dl>
<!-- Nested Definition Lists -->
<ul>
<li>Dallas Area
<ul>
<li>Dallas
<li>Richardson
</ul>
<li>Fort Worth Area
<ul>
<li>Fort Worth
<li>Benbrook
</ul>
</ul>
<!--*********************************************************************
* *
* Tables: *
* *
**********************************************************************-->
<hr><br><u><b>Tables</b></u><br>
<!-- default table -->
<table>
<caption>Table</caption>
<tr>
<th>Column A</th>
<th>Column B</th>
</tr>
<tr>
<td>1A</td>
<td>1B</td>
</tr>
<tr>
<td>2A</td>
<td>2B</td>
</tr>
</table>
<br>
<!-- table align -->
<table border="3" width="400">
<caption align="top"> Table Align </caption>
<tr>
<th align="left">
left Header
</th>
<th align="center">
Center Header
</th>
<th align="right"> Right Header</th>
<th nowrap> Nowrap Header</th>
</tr>
<tr align="left">
<td align="left"> Left Data</td>
<td align="center"> Center Data</td>
<td align="right"> Right Data</td>
<td nowrap> Nowrap Data</td>
</tr>
</table>
<br>
<!-- table vertical align -->
<table border="3">
<caption align="top"> Table Vertical Align </caption>
<tr>
<th valign="top" height="40"> Top Header </th>
<th valign="middle"> Middle Header </th>
<th valign="bottom"> Bottom Header </th>
<th valign="baseline"> Baseline Header </th>
</tr>
<tr valign="top">
<td valign="top" height="40"> Top Data</td>
<td valign="middle"> Middle Data</td>
<td valign="bottom"> Bottom Data</td>
<td valign="baseline"> Baseline Data</td>
</tr>
</table>
<br>
<!-- table sizing -->
<table border="3" width="400" cellspacing="10" cellpadding="5">
<caption> Table Sizing </caption>
<tr>
<th width="100" height="50"> Column A </th>
<th> Column B </th>
</tr>
<tr>
<td width="100" height="40"> 1A</td>
<td> 1B</td>
</tr>
<tr>
<td> 2A</td>
<td> 2B</td>
</tr>
</table>
<br>
<!-- table spanning -->
<table border="3">
<caption> Table Spanning </caption>
<tr>
<th rowspan=2> Column A </th>
<th colspan=2> Column B </th>
</tr>
<tr>
<td> 1B</td>
<td> 1C</td>
</tr>
<tr>
<td rowspan=2> 2A</td>
<td colspan=2> 2B</td>
</tr>
</table>
<br>
<!-- table coloring -->
<table border="3" bgcolor="yellow" bordercolor="red">
<caption>Table Color</caption>
<tr>
<th bgcolor="aqua" bordercolor="green"> Column A </th>
<th bgcolor="purple" bordercolor="black"> Column B </th>
</tr>
<tr>
<td bgcolor="teal" bordercolor="blue"> 1A</td>
<td> 1B</td>
</tr>
<tr bgcolor="maroon" bordercolor="olive">
<td> 2A</td>
<td> 2B</td>
</tr>
</table>
<br>
<!--*********************************************************************
* *
* Images: *
* *
**********************************************************************-->
<hr><br><u><b>Images</b></u><br>
<!-- Image link -->
<img src="img1.gif" height="25" width="25">
<!-- non-graphic message -->
<img src="img1.gif" height="25" width="25" alt="image 1">
<!-- image border -->
<img src="img1.gif" height="25" width="25" border="3">
<!-- jpeg image -->
<img src="img2.jpg" height="25" width="25" align="bottom"><br clear="all"><br>
<!-- image alignment -->
<img src="img1.gif" height="25" width="25" align="left">
<img src="img1.gif" height="25" width="25" align="right"><br clear="all"><br>
<!-- image vertical alignment -->
<img src="img1.gif" height="50" width="50" align="left">
<img src="img1.gif" height="25" width="25" align="top">
<img src="img1.gif" height="25" width="25" align="middle">
<img src="img1.gif" height="25" width="25" align="bottom">
<img src="img1.gif" height="25" width="25" align="texttop">
<img src="img1.gif" height="25" width="25" align="absmiddle">
<img src="img1.gif" height="25" width="25" align="baseline">
<img src="img1.gif" height="25" width="25" align="absbottom"><br clear="all"><br>
<!-- image spacing -->
<img src="img1.gif" height="25" width="25" vspace="25">
<img src="img1.gif" height="25" width="25" hspace="20"><br clear="all"><br>
<!--*********************************************************************
* *
* Links: *
* *
**********************************************************************-->
<hr><br><u><b>Links</b></u><br>
<!-- Creating a link -->
<a href="frame.html"> File Link </a><br>
<a href="javascript.html"> <img src="img1.gif" height="25" width="25"></a><br>
<a href="https://www.angelfire.com/tx4/cus/index.html"> External Link </a><br>
<a href="#fred"> Internal Link </a><br>
<a href="mailto:Chris.Rathman@tx.rr.com"> Chris Rathman </a><br>
<a name="fred"> Goto Label </a><br><br>
<!--*********************************************************************
* *
* Forms: *
* *
**********************************************************************-->
<hr><br><u><b>Forms</b></u><br>
<form name="myForm" action="HELLO.asp" method="POST"> <!-- enctype=? -->
<!-- button -->
<input type="button" name="myButton" value="Click Me"><br>
<!-- checkbox -->
<input type="checkbox" name="myCheckBox" checked>CheckBox Me<br>
<!-- hidden -->
<input type="hidden" name="myHidden" value="Hidden Me">
<!-- password -->
<input type="password" name="myPassword" value="Password Me"><br>
<!-- radio -->
<input type="radio" name="myRadio" value="radio1" checked>Radio Me #1
<input type="radio" name="myRadio" value="radio2">Radio Me #2<br>
<!-- reset -->
<input type="reset" name="myReset" value="Reset Me"><br>
<!-- select drop-down -->
<select name="mySelect">
<option value="myItem1">Item1
<option value="myItem2">Item2
<option value="myItem3">Item3
<option value="myItem4">Item4
<option value="myItem5">Item5
</select><br>
<!-- select list -->
<select name="mySelect" size="3" multiple>
<option value="myItem1">Item1
<option value="myItem2">Item2
<option value="myItem3">Item3
<option value="myItem4">Item4
<option value="myItem5">Item5
</select><br>
<!-- submit -->
<input type="submit" name="mySubmit" value="Submit Me"><br>
<!-- text -->
<input type="text" name="myText" value="Text Me" size="40" maxlength="40"><br>
<!-- textarea (WRAP=SOFT/HARD/NONE???) -->
<textarea name="myTextArea" cols="20" rows="3" wrap="virtual">TextArea Me</TEXTAREA><br>
<!-- submit - using image -->
<input type="image" src="img1.gif" align="left" height="25" width="25" >
</form>
<!--*********************************************************************
* *
* Address: *
* *
**********************************************************************-->
<br><hr><br><u><b>Address</b></u><br>
<!-- Author's Address encloses signature file of the author of page -->
<address>Chris.Rathman@tx.rr.com</address>
<!-- close out the document body -->
</body>
<!-- End of HTML document -->
</html>