<!-- 本页面通过使用html的表格展示新用户注册的页面，并使用CSS样式来改变其外观，使其更好看 -->
<html>
<head>
<title>新用户注册</title>
<head>
<title>新用户注册</title>
<!-- 使用CSS样式来设置边框的颜色 -->
<style type="text/css">
table {
border-style:solid; /*设置边框的线是实线*/
border-color:#0000ff; /*设置边框颜色*/
}
fieldset {
width:500px;
text-align: center;
bgcolor:cyan;
}
/*伪类的使用：link是定义初始时的颜色，visited是定义点击后的颜色，
hover是定义选中时的状态并出现下划线，text-decoration：定义下划线是否存在*/
a:link {
color:#ff0000;
text-decoration:none
}
a:visited {
color:#0000ffj;
text-decoration:none
}
a:hover {
text-decoration:underline;
}
</style>
</head>
<body >
<a href="www.baidu.com" align="center">百度一下，你就知道</a>
<fieldset >
<legend>新用户注册:</legend>
<table border="1" bgcolor=cyan align="center" >
<caption>填写个人信息</caption>
<tbody align="center"> <!-- 设置表格中的字体居中 -->
<tr>
<td>姓名</td>
<td><input type="text" name="userName"></td>
</tr>
<tr>
<td>密码</td>
<td><input type="password" name="userPwd"></td>
</tr>
<tr>
<td>性别</td>
<td><input type="radio" name="sex" value="男" checked="checked">男 <!-- checked：默认值为男 -->
<input type="radio" name="sex" value="女">女</td>
</tr>
<tr>
<td>爱好</td>
<td>
<input type="checkbox" name="hobby" value="篮球">篮球
<input type="checkbox" name="hobby" value="跑步">跑步
<input type="checkbox" name="hobby" value="游泳">游泳
<input type="checkbox" name="hobby" value="煲剧">煲剧
<input type="checkbox" name="hobby" value="其他" checked="checked">其他
</td>
</tr>
<tr>
<td>城市</td>
<td>
<select name="location">
<option value="choose">请选择城市
<option value="广州">广州
<option value="肇庆 ">肇庆
<option value="深圳">深圳
<option value="珠海">珠海
</select>
</td>
</tr>
<tr>
<td>自我介绍</td>
<td>
<textarea rows=3 cols=35 name="content" >请填写自我介绍内容，不超过120字</textarea> <!-- rows：3行，cols:35列 -->
</td>
</tr>
<tr>
<td colspan=2><input type="submit" value="提交"><!-- 使该单元格跨两列 -->
<input type="reset" value="重置"><!-- 重置即把表格的内容恢复到默认值 --></td>
</tr>
</tbody>
</table>
</fieldset>
</body>
</html>
<style type="text/css">
table {
border-style:solid; /*设置边框的线是实线*/
border-color:#0000ff; /*设置边框颜色*/
}
fieldset {
width:500px;
text-align: center;
bgcolor:cyan;
}
/*伪类的使用：link是定义初始时的颜色，visited是定义点击后的颜色，
hover是定义选中时的状态并出现下划线，text-decoration：定义下划线是否存在*/
a:link {
color:#ff0000;
text-decoration:none
}
a:visited {
color:#0000ffj;
text-decoration:none
}
a:hover {
text-decoration:underline;
}
</style>
</head>
<body >
<a href="www.baidu.com" align="center">百度一下，你就知道</a>
<fieldset >
<legend>新用户注册:</legend>
<table border="1" bgcolor=cyan align="center" >
<caption>填写个人信息</caption>
<tbody align="center"> <!-- 设置表格中的字体居中 -->
<tr>
<td>姓名</td>
<td><input type="text" name="userName"></td>
</tr>
<tr>
<td>密码</td>
<td><input type="password" name="userPwd"></td>
</tr>
<tr>
<td>性别</td>
<td><input type="radio" name="sex" value="男" checked="checked">男 <!-- checked：默认值为男 -->
<input type="radio" name="sex" value="女">女</td>
</tr>
<tr>
<td>爱好</td>
<td>
<input type="checkbox" name="hobby" value="篮球">篮球
<input type="checkbox" name="hobby" value="跑步">跑步
<input type="checkbox" name="hobby" value="游泳">游泳
<input type="checkbox" name="hobby" value="煲剧">煲剧
<input type="checkbox" name="hobby" value="其他" checked="checked">其他
</td>
</tr>
<tr>
<td>城市</td>
<td>
<select name="location">
<option value="choose">请选择城市
<option value="广州">广州
<option value="肇庆 ">肇庆
<option value="深圳">深圳
<option value="珠海">珠海
</select>
</td>
</tr>
<tr>
<td>自我介绍</td>
<td>
<textarea rows=3 cols=35 name="content" >请填写自我介绍内容，不超过120字</textarea> <!-- rows：3行，cols:35列 -->
</td>
</tr>
<tr>
<td colspan=2><input type="submit" value="提交"><!-- 使该单元格跨两列 -->
<input type="reset" value="重置"><!-- 重置即把表格的内容恢复到默认值 --></td>
</tr>
</tbody>
</table>
</fieldset>
</body>
</html>
239
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
