第一天作业:
首页:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<h1>欢迎您来到首页</h1>
<a href="./首页.html">首页</a>
<a href="./列表页.html">列表页</a>
<a href="./详情页.html">详情页</a>
<a href="./登录页.html">登录页</a><br>
<img src="./新建文件夹/首页.png" alt="">
</body>
</html>
登录页:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<h1>欢迎您来到登录页</h1>
<a href="./首页.html">首页</a>
<a href="./列表页.html">列表页</a>
<a href="./详情页.html">详情页</a>
<a href="./登录页.html">登录页</a><br>
<img src="./新建文件夹/登录页.png" alt="">
</body>
</html>
列表页:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<h1>欢迎您来到列表页</h1>
<a href="./首页.html">首页</a>
<a href="./列表页.html">列表页</a>
<a href="./详情页.html">详情页</a>
<a href="./登录页.html">登录页</a><br>
<img src="./新建文件夹/列表页.png" alt="">
</body>
</html>
详情页:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<h1>欢迎您来到详情页</h1>
<a href="./首页.html">首页</a>
<a href="./列表页.html">列表页</a>
<a href="./详情页.html">详情页</a>
<a href="./登录页.html">登录页</a><br>
<img src="./新建文件夹/详情页.png" alt="">
</body>
</html>
运行结果:
第二天作业:
交友网站:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<h2>青春不常在,抓紧谈恋爱</h2>
<br>
<form action="#">
<table>
<tbody>
<tr>
<td>性别</td>
<td>
<input type="radio" name="gender" value="男" checked>男
<input type="radio" name="gender" value="女">女
</td>
</tr>
<tr>
<td>生日</td>
<td>
<select name="yeer" id="" >
<option value="no" selected>--请选择年--</option>
<option value="1990">1990</option>
<option value="1991">1991</option>
<option value="1992">1992</option>
<option value="1993">1993</option>
<option value="1994">1994</option>
<option value="1995">1995</option>
<option value="1996">1996</option>
<option value="1997">1997</option>
<option value="1998">1998</option>
<option value="1999">1999</option>
<option value="2000">2000</option>
<option value="2001">2001</option>
<option value="2002">2002</option>
<option value="2003">2003</option>
<option value="2004">2004</option>
<option value="2005">2005</option>
</select>
<select name="month" id="">
<option value="no" selected>--请选择月--</option>
<option value="1">一月</option>
<option value="2">二月</option>
<option value="3">三月</option>
<option value="4">四月</option>
<option value="5">五月</option>
<option value="6">六月</option>
<option value="7">七月</option>
<option value="8">八月</option>
<option value="9">九月</option>
<option value="10">十月</option>
<option value="11">十一月</option>
<option value="12">十二月</option>
</select>
<select name="date" id="">
<option value="no" selected>--请选择日--</option>
<option value="1">1号</option>
<option value="2">2号</option>
<option value="3">3号</option>
<option value="4">4号</option>
<option value="5">5号</option>
<option value="6">6号</option>
<option value="7">7号</option>
<option value="8">8号</option>
<option value="9">9号</option>
<option value="10">10号</option>
<option value="11">11号</option>
<option value="12">12号</option>
<option value="13">13号</option>
<option value="14">14号</option>
<option value="15">15号</option>
<option value="16">16号</option>
<option value="17">17号</option>
<option value="18">18号</option>
<option value="19">19号</option>
<option value="20">20号</option>
<option value="21">21号</option>
<option value="22">22号</option>
<option value="23">23号</option>
<option value="24">24号</option>
<option value="25">25号</option>
<option value="26">26号</option>
<option value="27">27号</option>
<option value="28">28号</option>
<option value="29">29号</option>
<option value="30">30号</option>
<option value="31">31号</option>
</select>
</td>
</tr>
<tr>
<td>所在地区</td>
<td>
<input type="text" name="area" value="北京思密达">
</td>
</tr>
<tr>
<td>婚姻状况</td>
<td>
<input type="radio" name="hun" value="未婚" checked>未婚
<input type="radio" name="hun" value="已婚">已婚
<input type="radio" name="hun" value="离婚">离婚
</td>
</tr>
<tr>
<td>学历</td>
<td><input type="text" name="xueli" value="幼儿园"></td>
</tr>
<tr>
<td>喜欢的类型</td>
<td>
<input type="checkbox" name="like" id="wumei"><label for="wumei">妩媚的</label>
<input type="checkbox" name="like" id="cute"><label for="cute">可爱的</label>
<input type="checkbox" name="like" id="xianrou"><label for="xianrou">小鲜肉</label>
<input type="checkbox" name="like" id="larou"><label for="larou">老腊肉</label>
<input type="checkbox" name="like" id="all"><label for="all">都喜欢</label>
</td>
</tr>
<tr>
<td>自我介绍</td>
<td><textarea name="jieshao" id="" cols="30" rows="10">自我介绍</textarea></td>
</tr>
<tr>
<td></td>
<td><button>免费注册</button></td>
</tr>
<tr>
<td></td>
<td><input type="checkbox" name="agree" id="tongyi" checked>我同意注册条款和会员加入标准</td>
</tr>
<tr>
<td></td>
<td><a href="./登录页.html">我是会员,立即登录</a></td>
</tr>
<tr>
<td></td>
<td><h1>我承诺</h1></td>
</tr>
<tr>
<td></td>
<td><ul>
<li>年满18岁、单身</li>
<li>抱着严肃的态度</li>
<li>真诚寻找另一半</li>
</ul></td>
</tr>
</tbody>
</table>
</form>
</body>
</html>
登录页:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<h1>尊敬的会员您好,请登录</h1>
<form action="#">
用户名:<input type="text" name="user"><br>
密码:<input type="password" name="pwd"><br>
<button>登录</button>
</form>
</body>
</html>
运行结果: