Web小练习01
#制作简易网页#
本章包括主页、注册页面、登陆页面
主页
1.1主页代码如下
<!DOCTYPE html>
<html lang="zh">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>主页</title>
<style>
html,body{
background: linear-gradient(20deg,rgb(141, 180, 211),rgb(207, 155, 209));
}
</style>
</head>
<body>
<h1 align="center">主页</h1>
<hr>
<p>
<a href="login.html" target="_blank">登录</a>
</p>
<p>
<a href="register.html" target="_blank">注册</a>
</p>
</body>
</html>1.2 展示
注册页面
2.1 注册页面代码如下
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>注册页面</title>
<style>
html,body{
height:100%;
width:100%;
background: linear-gradient(20deg,rgb(148,207,255),rgb(253,200,255));
display: flex;
justify-content: center;
align-items: center;
}
</style>
</head>
<body>
<form method="get" action="index.html">
<table width="500" border="0" cellpadding="10" align="center" bgcolor="pink">
<tr align="center">
<td colspan="2">
会员登录
</td>
</tr>
<tr align="center">
<td align="right">
<label for="zhanghao">
账号：
</label>
</td>
<td>
<input type="text" id="zhanghao" placeholder="请输入账号"/>
</td>
</tr>
<tr align="center">
<td align="right">
<label for="mima">
密码：
</label>
</td>
<td >
<input type="password" id="miman" placeholder="请输入密码">
</td>
</tr>
<tr>
<td colspan="2" height="50" align="center">
<input type="submit" value="登录" />
<input type="reset" value="重置" />
</td>
</tr>
</table>
</form>
</body>
</html>2.2 展示
登陆页面
3.1 登陆页面代码如下
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>登陆页面</title>
<style>
html,body{
height:100%;
width:100%;
background: linear-gradient(20deg,rgb(148,207,255),rgb(253,200,255));
display: flex;
justify-content: center;
align-items: center;
}
</style>
</head>
<body>
<form method="get" action="login.html">
<table border="0" width="650" align="center" cellspacing="0" celladding="10" bgcolor="#9E7AC0">
<caption align="center" style="text-align: center;">
<font size="8">注册</font>
</caption>
<tr>
<td colspan="2">注册</td>
</tr>
<tr align="center">
<td align="right"><label for="yonghuming">用户名：</label></td>
<td><input type="text" id="yonghuming" placeholder="请输入用户名"/></td>
</tr>
<tr align="center">
<td align="right"><label for="zhanghao">账号：</label></td>
<td><input type="text" id="zhanghao" placeholder="请输入账号"/></td>
</tr>
<tr align="center">
<td align="right"><label for="mima">密码：</label></td>
<td ><input type="password" id="mima" placeholder="请输入密码"></td>
</tr>
<tr align="center">
<td align="right"><label for="miman">再次输入密码：</label></td>
<td ><input type="password" id="miman" placeholder="请再次输入密码"></td>
</tr>
<tr>
<td colspan="2" height="50" align="center">
<input type="submit" value="注册" />
<input type="reset" value="重置" />
</td>
</tr>
</table>
</form>
</body>
</html>3.2 展示
