运用表格布局
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
</head>
<body>
<table align="center"width="839" height="483" border="0">
<tr>
<td colspan="4" align="center" bgcolor="#3366FF">HP-EMP XX公司用户注册</td>
</tr>
<tr>
<td colspan="4" height="1" bgcolor="#3333FF"></td>
</tr>
<tr>
<td width="106" height="56">用户名:</td>
<td width="217"><input type="text" name="textfield" id="textfield" /></td>
<td> </td>
<td width="297"><font size="1">英文字母阿拉伯数字下划线组合，长度为6~20位，只能以字母开头</font></td>
</tr>
<tr>
<td>输入密码:</td>
<td><form id="form1" name="form1" method="post" action="">
<label for="textfield2"></label>
<input type="password" name="textfield2" id="textfield2" />
</form></td>
<td rowspan="2"> </td>
<td rowspan="2"><font size="1">英文字母或阿拉伯数字组合，英文区分大小写，长度为6~20位</font></td>
</tr>
<tr>
<td>验证密码:</td>
<td><form id="form1" name="form1" method="post" action="">
<label for="textfield2"></label>
<input type="password" name="textfield2" id="textfield2" />
</form></td>
<td width="11" colspan="2"></td>
</tr>
<tr>
<td height="1" bgcolor="#3333FF" colspan="4"> </td>
</tr>
<tr>
<td height="41">密码提示问题:</td>
<td><select name="你最难忘的日子是？" size="1">
<option>你最难忘的日子是？</option>
</select></td>
<td> </td>
<td rowspan="2"><font size="1">当你忘记密码时，可以通过密码问题和答案来查询，密码提示答案为6~20位位之间不能包含特殊字符</font></td>
</tr>
<tr>
<td height="70" colspan="">密码提示答案:</td>
<td><input name="" type="text" /></td>
<td width="186"> </td>
<td width="11"> </td>
</tr>
<tr>
<td height="1" bgcolor="#3333FF" colspan="4"> </td>
</tr>
<tr>
<td>出生日期:</td>
<td><select name="date" size="1">
<option value="1" selected="selected"></option>
<option>2011</option>
<option>2012</option>
<option>2013</option>
<option>2014</option>
<option>2015</option>
</select>年
<select size="1" name="date">
<option value="1" selected="selected"></option>
<option> 一月</option>
<option> 二月</option>
<option> 三月</option>
<option> 四月</option>
<option> 五月</option>
</select>月
<select name="date" >
<option value="1" selected="selected"></option>
<option>1</option>
<option>2</option>
<option>3</option>
<option>4</option>
<option>5</option>
</select>日
</td>
<td> </td>
<td> </td>
</tr>
<tr>
<td>性别</td>
<td><form><input name="radio" type="radio" value="" />
男
<input type="radio" name="radio" id="radio" value="radio" />
<label for="radio"></label>
女
</form></td>
<td> </td>
<td><font size="1">为了方便你的使用请填写真实信息</font></td>
</tr>
<tr>
<td height="51">常用邮箱:</td>
<td><form id="form2" name="form2" method="post" action="">
<label for="textfield3"></label>
<input type="text" name="textfield3" id="textfield3" />
</form></td>
<td> </td>
<td><font size="1">方便你取得邮箱账号相关的重要信息，包括找回密码</font></td>
</tr>
<tr>
<td height="1" bgcolor="#3333FF" colspan="4"> </td>
</tr>
<tr>
<td>请输入验证码:</td>
<td><form id="form3" name="form3" method="post" action="">
<label for="textfield4"></label>
<input type="text" name="textfield4" size="5" id="textfield4" />
<label for="textfield5" >0077</label>
刷新
</form></td>
<td> </td>
<td><font size="1">请将系统产生的4位验证码数字输入到系统验证码的输入框中</font></td>
</tr>
<tr>
<td height="1" bgcolor="#3333FF" colspan="4"> </td>
</tr>
<tr>
<td> </td>
<td><form id="form4" name="form4" method="post" action="">
<input type="checkbox" name="checkbox" id="checkbox" />
<label for="checkbox"></label>
我已阅读并接受<a href="#">服务条款</a>
</form></td>
<td> </td>
<td><font size="1">选择HT-EMP服务前，请仔细阅读条款</font></td>
</tr>
<tr>
<td align="center" colspan="4"><input type="button" value="提交" /></td>
</tr>
<tr>
<td colspan="4" height="1" bgcolor="#3333FF"></td>
</tr>
</table>
</body>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
</head>
<body>
<table align="center"width="839" height="483" border="0">
<tr>
<td colspan="4" align="center" bgcolor="#3366FF">HP-EMP XX公司用户注册</td>
</tr>
<tr>
<td colspan="4" height="1" bgcolor="#3333FF"></td>
</tr>
<tr>
<td width="106" height="56">用户名:</td>
<td width="217"><input type="text" name="textfield" id="textfield" /></td>
<td> </td>
<td width="297"><font size="1">英文字母阿拉伯数字下划线组合，长度为6~20位，只能以字母开头</font></td>
</tr>
<tr>
<td>输入密码:</td>
<td><form id="form1" name="form1" method="post" action="">
<label for="textfield2"></label>
<input type="password" name="textfield2" id="textfield2" />
</form></td>
<td rowspan="2"> </td>
<td rowspan="2"><font size="1">英文字母或阿拉伯数字组合，英文区分大小写，长度为6~20位</font></td>
</tr>
<tr>
<td>验证密码:</td>
<td><form id="form1" name="form1" method="post" action="">
<label for="textfield2"></label>
<input type="password" name="textfield2" id="textfield2" />
</form></td>
<td width="11" colspan="2"></td>
</tr>
<tr>
<td height="1" bgcolor="#3333FF" colspan="4"> </td>
</tr>
<tr>
<td height="41">密码提示问题:</td>
<td><select name="你最难忘的日子是？" size="1">
<option>你最难忘的日子是？</option>
</select></td>
<td> </td>
<td rowspan="2"><font size="1">当你忘记密码时，可以通过密码问题和答案来查询，密码提示答案为6~20位位之间不能包含特殊字符</font></td>
</tr>
<tr>
<td height="70" colspan="">密码提示答案:</td>
<td><input name="" type="text" /></td>
<td width="186"> </td>
<td width="11"> </td>
</tr>
<tr>
<td height="1" bgcolor="#3333FF" colspan="4"> </td>
</tr>
<tr>
<td>出生日期:</td>
<td><select name="date" size="1">
<option value="1" selected="selected"></option>
<option>2011</option>
<option>2012</option>
<option>2013</option>
<option>2014</option>
<option>2015</option>
</select>年
<select size="1" name="date">
<option value="1" selected="selected"></option>
<option> 一月</option>
<option> 二月</option>
<option> 三月</option>
<option> 四月</option>
<option> 五月</option>
</select>月
<select name="date" >
<option value="1" selected="selected"></option>
<option>1</option>
<option>2</option>
<option>3</option>
<option>4</option>
<option>5</option>
</select>日
</td>
<td> </td>
<td> </td>
</tr>
<tr>
<td>性别</td>
<td><form><input name="radio" type="radio" value="" />
男
<input type="radio" name="radio" id="radio" value="radio" />
<label for="radio"></label>
女
</form></td>
<td> </td>
<td><font size="1">为了方便你的使用请填写真实信息</font></td>
</tr>
<tr>
<td height="51">常用邮箱:</td>
<td><form id="form2" name="form2" method="post" action="">
<label for="textfield3"></label>
<input type="text" name="textfield3" id="textfield3" />
</form></td>
<td> </td>
<td><font size="1">方便你取得邮箱账号相关的重要信息，包括找回密码</font></td>
</tr>
<tr>
<td height="1" bgcolor="#3333FF" colspan="4"> </td>
</tr>
<tr>
<td>请输入验证码:</td>
<td><form id="form3" name="form3" method="post" action="">
<label for="textfield4"></label>
<input type="text" name="textfield4" size="5" id="textfield4" />
<label for="textfield5" >0077</label>
刷新
</form></td>
<td> </td>
<td><font size="1">请将系统产生的4位验证码数字输入到系统验证码的输入框中</font></td>
</tr>
<tr>
<td height="1" bgcolor="#3333FF" colspan="4"> </td>
</tr>
<tr>
<td> </td>
<td><form id="form4" name="form4" method="post" action="">
<input type="checkbox" name="checkbox" id="checkbox" />
<label for="checkbox"></label>
我已阅读并接受<a href="#">服务条款</a>
</form></td>
<td> </td>
<td><font size="1">选择HT-EMP服务前，请仔细阅读条款</font></td>
</tr>
<tr>
<td align="center" colspan="4"><input type="button" value="提交" /></td>
</tr>
<tr>
<td colspan="4" height="1" bgcolor="#3333FF"></td>
</tr>
</table>
</body>