预计效果和具体要求为:
![请添加图片描述](https://i-blog.csdnimg.cn/blog_migrate/40b0d113cefd6b7339970942f94d153e.jpeg)
实现代码为
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title></title>
<style type="text/css">
.lable{
text-align: right;
}
.topandfoot{
text-align: center;
background-color: gray;
}
td{
background-color: #DDDDDD;
}
table{
border: 1px solid white;
margin:100px auto;
}
</style>
</head>
<body>
<form action="woskunzongdad" method="get">
<table>
<tr>
<td class="topandfoot" colspan="2" >用户注册</td>
</tr>
<tr>
<td class="lable">用户名:</td>
<td><input type="text" name="UserName" size="15"></td>
</tr>
<tr>
<td class="lable">密码:</td>
<td><input type="passwd" name="Userpass" size="15"></td>
</tr>
<tr>
<td class="lable">性别:</td>
<td><input type="radio" name="sex" value="man" checked>男<input type="radio" name="sex" value="woman">女</td>
</tr>
<tr>
<td class="lable">爱好:</td>
<td><input type="checkbox" name="like" value="wirte">写作<input type="checkbox" name="like" value="music">听音乐<input type="checkbox" name="like" value="sports">体育</td>
</tr>
<tr>
<td class="lable">省份:</td>
<td><select name="province">
<option value="shanxi">陕西市</option>
<option value="sichuan">四川省</option>
<option value="chongqin">重庆市</option>
<option value="yunlan">云南省</option>
</select>
</td>
</tr>
<tr>
<td class="lable">自我介绍</td>
<td><textarea name="intro" cols="25" rows="5">这个家伙什么都没留下</textarea></td>
</tr>
<tr>
<td colspan="2" class="topandfoot"><input type="submit" name="send" ><input type="reset" name="reset"></td
</tr>
</table>
</form>
</body>
</html>
实际效果为:
![请添加图片描述](https://i-blog.csdnimg.cn/blog_migrate/68dbfea49919929a9b6f3dfd1b51e3a2.png)