案例来源于:黑马程序员
仅限于练习打卡,学习记录
效果图先上:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<h1>注册页面</h1>
<table class="rede">
<tr class="male">
<td>性别:</td>
<td><input type="radio" name='nan'>男 <input type="radio" name='nan'>女</td>
</tr>
<tr>
<td>生日:</td>
<td>
<select>
<option>--请选择年分--</option>
<option>1990</option>
<option>1991</option>
</select>
<select>
<option>--请选择月份--</option>
<option>11月</option>
<option>12月</option>
</select>
<select>
<option>--请选择日期--</option>
<option>11日</option>
<option>12日</option>
</select>
</td>
</tr>
<tr>
<td>所在地:</td>
<td>
<input type="text">
</td>
</tr>
<tr>
<td>婚姻状况</td>
<td>
<input type="radio" name='marry'>已婚 <input type="radio" name='marry'>未婚
</td>
</tr>
<tr>
<td>学历</td>
<td>
<select>
<option>初中</option>
<option>高中</option>
<option>大学</option>
</select>
</td>
</tr>
<tr>
<td>喜欢的类型:</td>
<td>
<input type="checkbox" name="like">美女<input type="checkbox" name="like">工程师
</td>
</tr>
<tr>
<td>自我介绍:</td>
<td><textarea name="" id="" cols="30" rows="10"></textarea></td>
</tr>
<tr>
<td></td>
<td><input type="button" value='提交'></td>
</tr>
<tr>
<td></td>
<td>
<input type="checkbox">我同意……
</td>
</tr>
<tr>
<td></td>
<td><a href="#">已有账号,立即登陆</a></td>
</tr>
</table>
</body>
</html>