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