<!doctype html public "-//W3C//DTD HTML 3.2 Final//EN">
<html><head>
<title>HTML 3.2 Document Sample</title>
<meta http-equiv="Content-type" content="text/html; charset=iso-8859-1">
<link rev="made" href="mailto:hosono@si.gunma-u.ac.jp">
</head>
<body bgcolor="#e8e8e8" text=black link=red vlink=maroon alink=fuchsia>
<h1><a href="http://validator.w3.org/check?uri=http://www.si.gunma-u.ac.jp/~hosono/html/html32.html">
<img src="ic/vh32.png" alt="[Valid HTML 3.2]" width=88 height=31></a>
HTML 3.2 Document Sample</h1>
<h5><i>Based on:</i>  <a href="spec/HTML32/HTML32.dtd">HTML32.dtd</a>
(1997/01/14 by <em>Dave Raggett</em>)</h5>
<i>Last modified:</i> 2003/06/19
<hr>
<h3><img src="line.gif" alt="========== " align=middle> Headings / Blocks</h3>

<h1>Heading Level 1</h1>
<h2 align=center>Heading Level 2</h2>
<h3 align=right>Heading Level 3</h3>
<h4 align=right>Heading Level 4</h4>
<h5 align=center>Heading Level 5</h5>
<h6 align=left>Heading Level 6</h6>

<p align=left>This is a left-aligned paragraph.<br>Can you see so?</p>
<p align=center>This is a centering paragraph.<br>Can you see so?</p>
<p align=right>This is a right-aligned paragraph.<br>Can you see so?</p>

<div align=left>This is a left-aligned division.<br>Can you see so?</div>
<div align=center>This is a centering division.<br>Can you see so?</div>
<div align=right>This is a right-aligned division.<br>Can you see so?</div>

<center>CENTER is a shorthand for DIV with ALIGN=CENTER.</center>

<h3><img src="line.gif" alt="========== " align=middle> Link / Images</h3>

<p>URL: <a href="http://www.si.gunma-u.ac.jp/~hosono/html/html32.html">
http://www.si.gunma-u.ac.jp/~hosono/html/html32.html</a>
(<a href="html32_src.html">Source</a>)
<br><a href="http://www.w3.org/TR/REC-html32#anchor">Related part</a>
of W3C HTML 3.2 description.

<p>There are top-aligned line <img src="line2.gif" alt="T" align=top> and
picture <img src="sample/pic.gif" alt="TP" align=top width=50>.<br>
There are middle-aligned line <img src="line2.gif" alt="M" align=middle> and
picture <img src="sample/pic.gif" alt="MP" align=middle width=60 height=60>.<br>
There are bottom-aligned line <img src="line2.gif" alt="B" align=bottom> and
picture <img src="sample/pic.gif" alt="BP" align=bottom>.
<p>
<img src="sample/dog.jpg" alt="LP" align=left vspace=5 hspace=15>
<img src="sample/pic.gif" alt="RP" align=right vspace=5 hspace=10>
Here are the floating images.
Image of the dog will float over the left margin, and subsequent text wraps
around the right hand side of this image.  Image of 3-object picture will float
over the right margin, and the text wraps around its left hand side.
<br clear=all>
So in this case subsequent text is between these images.
<p>
The following imagemap is not server-side but client-side:
<map name="imap">
<area shape=rect coords="15,2,50,19" alt="red box"
      href="http://www.gunma-u.ac.jp/">
<area shape=circle coords="14,35,13" alt="green circle"
      href="http://www.si.gunma-u.ac.jp/">
<area shape=poly coords="33,36,36,42,64,42,69,36,57,36,54,27,48,29,44,36"
      alt="blue ship" href="http://www.si.gunma-u.ac.jp/~hosono/">
<area shape=rect coords="0,0,71,49" alt="white background" nohref>
</map>
<img src="sample/pic.gif" alt="imagemap" usemap="#imap" border=0></p>

<h3><img src="line.gif" alt="========== " align=middle> Lists</h3>

<dl compact>
<dt> first term
<dd> the definition of first term
<dt> second term
<dd> the definition of second term
<dt> third term
<dd> the definition of third term
</dl>
<ul>
<li> first item
     <ul>
     <li> aaaa
          <ul>
          <li> abc
               <ul>
               <li> def
               </ul>
          <li> xyz
          </ul>
     <li> bbbb
     </ul>
<li> second item
     <ul type=square>
     <li> cccc
          <ul type=disc>
          <li> ghi
               <ul type=circle>
               <li> ijk
               </ul>
          <li> pqr
          </ul>
     <li> dddd
     </ul>
<li type=circle> third item
</ul>
<ol>
<li> first item
     <ol type=a>
     <li> aaaa
          <ol type=i>
          <li> abc
               <ol type=1>
               <li> def
               </ol>
          <li> xyz
          </ol>
     <li> bbbb
     </ol>
<li> second item
     <ol type=a start=3>
     <li> cccc
     <li> dddd
     </ol>
<li value=10> third item
     <ol type=I>
     <li> aaaa
          <ol type=A>
          <li> abc
          <li> xyz
          </ol>
     <li> bbbb
     </ol>
</ol>
<!-- don't use MENU or DIR -->
<menu>
<li> first item of menu
<li> second item
<li> third item
</menu>
<dir>
<li> first item of directory
<li> second item
<li> third item
</dir>

<h3><img src="line.gif" alt="========== " align=middle> Text / Phrase</h3>

<p>
<tt>Typewriter text, e.g. fixed-width font</tt><br>
<b>Bold text</b><br><i>Italic text</i><br><u>Underlined text</u><br>
<strike>Strike-through text</strike><br>
This is <big>BIG font</big><br>This is <small>SMALL font</small><br>
Subscript: x<sub>2</sub><br>Superscript: x<sup>n</sup><br>
<p>
<em>Emphasized phrase</em><br><strong>Strong emphasis</strong><br>
<samp>Sample text or characters</samp><br>
Keyboard directive: press <kbd>RETURN</kbd> key<br>
Variables: <var>name</var>, <var>count</var><br>
<cite>Name or title of cited work</cite><br>
Source code phrase: <code>printf("hello, world\n");</code><br>
<p>
<font size=1>size=1</font> <font size=2>size=2</font> <font size=3>size=3</font>
<font size=4>size=4</font> <font size=5>size=5</font> <font size=6>size=6</font>
<font size=7>size=7</font>
<br>
<font size="-4">size=-4</font> <font size="-3">size=-3</font>
<font size="-2">size=-2</font> <font size="-1">size=-1</font>
<font size="+1">size=+1</font> <font size="+2">size=+2</font>
<font size="+3">size=+3</font> <font size="+4">size=+4</font>
<br>
<basefont size=6>
<font size="-4">size=-4</font> <font size="-3">size=-3</font>
<font size="-2">size=-2</font> <font size="-1">size=-1</font>
<font size="+1">size=+1</font> <font size="+2">size=+2</font>
<font size="+3">size=+3</font> <font size="+4">size=+4</font>
<basefont size=3>
<p>
Font color:
<font color=aqua>Aqua</font>, <font color=black>Black</font>,
<font color=blue>Blue</font>, <font color=fuchsia>Fuchsia</font>,
<font color=gray>Gray</font>, <font color=green>Green</font>,
<font color=lime>Lime</font>, <font color=maroon>Maroon</font>,
<font color=navy>Navy</font>, <font color=olive>Olive</font>,
<font color=purple>Purple</font>, <font color=red>Red</font>,
<font color=silver>Silver</font>, <font color=teal>Teal</font>,
<font color=white>White</font>, <font color=yellow>Yellow</font>

<p>This paragraph contains a quotation:
<blockquote>This block is a quotation.  This block is a quotation.
This is a quotation.  This is a quotation.</blockquote>
The quotation ends here.

<p>Send S-mail at:<br>
<address>
Fumio HOSONO<br>
Fac. of Social and Information Studies, Gunma Univ.<br>
4-2 Aramaki-machi, Maebashi, Gunma  371-8510  JAPAN
</address>

<pre>
This is
a preformatted
text.
</pre>

<p>Horizontal rules follow:<br>
<hr>
<hr width=200 align=right>
<hr width="50%" size=10 align=center>
<hr noshade>

<p>Some HTML comment lines follow:<br>
<!-- you should not be able to see this phrase --><br>
<!-- <strong>you should not be able to see this phrase</strong> --><br>
</p>

<h3><img src="line.gif" alt="========== " align=middle> Tables</h3>

<table border=1 width="40%">
<tr><td height=40>Alpha</td>
    <td align=center valign=bottom height=40>Beta</td>
    <td valign=middle height=40>Gamma</td></tr>
<tr><td align=right valign=top height=40>Delta</td>
    <td align=center valign=middle height=40>Epsilon</td>
    <td align=left valign=bottom height=40>Lambda</td></tr>
</table>
<br>
<table border=1 cellpadding=5 cellspacing=1>
<caption align=bottom>Gender Comparison Table</caption>
<tr><th rowspan=2 colspan=2></th>
    <th colspan=2>Average</th></tr>
<tr><th>Height</th><th>Weight</th></tr>
<tr><th rowspan=2 valign=top>Gender</th>
    <th>Males</th><td align=right>171.5</td><td align=right>60.8</td></tr>
<tr><th>Females</th><td align=right>158.6</td><td align=right>44.5</td></tr>
</table>

<h3><img src="line.gif" alt="========== " align=middle> Forms</h3>

<form action="http://www.f.si.gunma-u.ac.jp/~hosono/cgi/query.cgi" method=POST>
<b>Your name:</b>  <input type=text name="name" size=15 maxlength=25 value="">
<b>Your email:</b> <input type=text name="email" size=25 maxlength=40 value="">
<br><b>Your sex:</b> <select name="sex">
<option value="M" selected> Male
<option value="F"> Female
</select>
<b>Your blood:</b>
<input type="radio" name="blood" value="A"> A
<input type="radio" name="blood" value="B"> B
<input type="radio" name="blood" value="O" checked> O
<input type="radio" name="blood" value="AB"> AB
<br>
<!-- The following item is not displayed. -->
<input type="hidden" name="item" value="hidden item" size="20">
<br><b>Your favorite topics:</b><br>
<input type="checkbox" name="favor" value="A"> Internet / Multimedia
<input type="checkbox" name="favor" value="B"> Linguistic / Culture
<input type="checkbox" name="favor" value="C"> Sociology
<input type="checkbox" name="favor" value="D"> Politics
<input type="checkbox" name="favor" value="E"> Economics
<input type="checkbox" name="favor" value="F"> Others
<br><b>Please write your message.</b> (<i>fewer than 1000 characters</i>)<br>
<textarea name="mesg" rows=5 cols=60></textarea><br>
<input type="submit" value=" Submit "><input type="reset" value=" Clear ">
</form>

<h3><img src="line.gif" alt="========== " align=middle> Applets / Scripts</h3>

<p>Clock
<applet codebase="." code="Clock.class" width=200 height=24 align=middle>
Your browser doesn't understand the &lt;APPLET&gt; tag.
</applet>
<applet codebase="." code="Clock.class" width=200 height=24 align=middle>
<param name="bgcolor" value="e8e8e8">
<param name="fgcolor" value="008000">
<param name="timezone" value="JST">
Your browser doesn't understand the &lt;APPLET&gt; tag.
</applet>
<script>
<!--
document.write("<br>This message is displayed by the SCRIPT tag.");
// -->
</script>

<h3><img src="line.gif" alt="========== " align=middle> Characters</h3>

<p>Escape sequences:<br>
5 &lt; 7  &amp;  8 &gt; 2</p>

<p>Accented characters:<br>
Gr&uuml;&szlig; Gott (Hello)</p>

<p>Additional characters:<br>
176 &#177; 2<br>
Long. 139&#176;03'50"E, Lat. 36&#176;23'16"N</p>
<hr>
<address><a href="http://www.si.gunma-u.ac.jp/~hosono/">Fumio HOSONO</a>
&lt;hosono@si.gunma-u.ac.jp&gt;</address>
</body></html>