目录
页面预览:
注册页面代码如下:
<!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>世纪佳缘-你在我也在</title>
</head>
<body>
<form action="">
<table border="1" width="600" align="center">
<caption>
<h3>青春不常在,抓紧谈恋爱</h3>
</caption>
<tr>
<td>
性别
</td>
<td>
<input type="radio" name="sex" id="men" checked>
<label for="men"><img src="images/man.jpg">男</label>
<label>
<input type="radio" name="sex">
<img src="images/man.jpg">女
</label>
</td>
</tr>
<tr>
<td>
生日
</td>
<td>
<select>
<option>--请选择年--</option>
<option value="2000">2000</option>
<option value="2001">2001</option>
</select>
<select>
<option>--请选择月--</option>
<option value="1">1</option>
<option value="2">2</option>
</select>
<select>
<option>--请选择日--</option>
<option value="01">01</option>
<option value="02">02</option>
</select>
</td>
</tr>
<tr>
<td>
所在地区
</td>
<td>
<input type="text" value="北京">
</td>
</tr>
<tr>
<td>
婚姻状况
</td>
<td>
<input type="radio" name="marry"> 未婚
<input type="radio" name="marry"> 已婚
<input type="radio" name="marry"> 离婚
</td>
</tr>
<tr>
<td>
学历
</td>
<td>
<input type="text" value="幼儿园">
</td>
</tr>
<tr>
<td>
月薪
</td>
<td>
<input type="text" value="10000-20000">
</td>
</tr>
<tr>
<td>
手机号码
</td>
<td>
<input type="text">
</td>
</tr>
<tr>
<td>
昵称
</td>
<td>
<input type="text">
</td>
</tr>
<tr>
<td>
喜欢的类型
</td>
<td>
<input type="checkbox"> 妩媚的<input type="checkbox"> 可爱的<input type="checkbox"> 小鲜肉<input type="checkbox"> 老腊肉<input type="checkbox"> 都喜欢
</td>
</tr>
<tr>
<td>
自我介绍
</td>
<td>
<textarea>自我介绍</textarea>
</td>
</tr>
<tr>
<td></td>
<td>
<input type="image" src="images/btn.png">
</td>
</tr>
<tr>
<td></td>
<td>
<input type="checkbox" checked>我同意注册条款和会员加入标准
</td>
</tr>
<tr>
<td></td>
<td>
<a href="login.html">我是会员,立即登录</a><br>
<a href="edit.html">前往修改页面</a>
</td>
</tr>
<tr>
<td></td>
<td>
<h3>我承诺</h3>
<ul>
<li>年满18岁、单身</li>
<li>抱着严肃的态度</li>
<li>真诚寻找另一半</li>
</ul>
</td>
</tr>
</table>
</form>
</body>
</html>
登录页面代码:
<!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>
<form action="">
<table align="center">
<caption>
<h2>欢迎来到登录页面</h2>
</caption>
<tr>
<td>
请输入手机号:
</td>
<td>
<input type="text">
</td>
</tr>
<tr>
<td>
请输入密码:
</td>
<td>
<input type="password">
</td>
</tr>
<tr>
<td>
验证码:
</td>
<td>
<input type="text">
</td>
<td>
<img src="images/验证码.bmp">
</td>
</tr>
<tr>
<td>
<input type="submit" value="登录">
</td>
<td>
<input type="reset" value="取消">
</td>
</tr>
</table>
</form>
</body>
</html>
修改页面代码:
<!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>
<form action="">
<table align="center" style="margin-top: 80px;">
<caption>
<h2>欢迎来到修改页面</h2>
</caption>
<tr>
<td>
姓名:
</td>
<td>
<input type="text" placeholder="jack">
</td>
</tr>
<tr>
<td>
性别:
</td>
<td>
<input type="radio" name="sex">女士
<input type="radio" name="sex">男士
</td>
</tr>
<tr>
<td>
学历:
</td>
<td>
<select name="" id="">
<option value="">幼儿园</option>
<option value="">小学</option>
<option value="">中学</option>
<option value="">高中</option>
<option value="">大学</option>
</select>
</td>
</tr>
<tr>
<td>
个人描述:
</td>
<td>
<textarea></textarea>
</td>
</tr>
<tr>
<td></td>
<td>
<input type="checkbox">不要公开我的个人信息
</td>
</tr>
<tr>
<td></td>
<td>
<input type="submit" value="保存">
<input type="reset" value="重填">
</td>
</tr>
</table>
</form>
</body>
</html>