一、主页
1.主页代码
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>系统主页</title>
</head>
<body>
<h3>系统主页</h3>
<a href="./register.html" target="_blank">注册</a>
<a href="./login.html" target="_blank">登录</a>
</body>
</html>
2.主页展示效果
二、注册
1.代码
<body>
<form method="get" action="./index.html">
<table width="500" border="0" cellpadding="10" align="center">
<tr align="center">
<td colspan="2">用户注册</td>
</tr>
<tr>
<td align="right"><label for="zhanghao1">账 号:</label></td>
<td><input type="text" id="zhanghao" placeholder="请输入账号:"></td>
</tr>
<tr>
<td align="right"><label for="mima">密 码:</label></td>
<td><input type="password" name="" id="mima" placeholder="请输入密码:"></td>
</tr>
<tr>
<td align="right"><label for="querenmima">确认密码:</label></td>
<td><input type="password" name="" id="querenmima" placeholder="请再次输入密码:"></td>
</tr>
<tr>
<td align="right"><label for="touxiang">选择头像:</label></td>
<td><input type="file" name="" id="touxiang" placeholder="请选择头像"></td>
</tr>
<tr>
<td align="right"><label for="nicheng">昵 称:</label></td>
<td><input type="text" id="nicheng" placeholder="请输入昵称:"></td>
</tr>
<tr>
<td align="right"><label for="xingbie">性 别:</label></td>
<td>
<input type="radio" name="xb" id="xingbie" value="男">男
<input type="radio" name="xb" id="xingbie2" value="女">女
</td>
</tr>
<tr>
<td align="right"><label for="nianling">年 龄:</label></td>
<td><input type="number" id="nianling" placeholder="请输入年龄:"></td>
</tr>
<tr>
<td align="right"><label for="youxiang">邮 箱:</label></td>
<td><input type="email" id="youxiang" placeholder="请输入邮箱:"></td>
</tr>
<tr>
<td colspan="2" align="center">
<input type="reset" value="清空">
<input type="submit" value="注册">
</td>
</tr>
</table>
</form>
</body>
2.展示效果
三、登录
1.代码
<body>
<form method="get" action="./index.html">
<table width="500" border="0" cellpadding="10" align="center">
<tr align="center">
<td colspan="2">会员登录页面</td>
</tr>
<tr>
<td align="right"><label for="zhanghao">账号:</label></td>
<td><input type="text" name="zhanghao" id="zhanghao" placeholder="请输入账号:"></td>
</tr>
<tr>
<td align="right"><label for="mima">密码:</label></td>
<td><input type="password" name="mima" id="mima" placeholder="请输入密码:"></td>
</tr>
<tr>
<td colspan="2" align="center">
<input type="reset" value="清空">
<input type="submit" value="登录">
</td>
</tr>
</table>
</form>
</body>
2.展示效果