登录界面设计
采用表格设计,能让登录界面对齐,更美观
<title>登录页面
<!--success.html是点击登录后跳转的成功界面,参数采用post方法传递-->
<form action="success.html" method="post">
<table align="center">
<!--输入用户名-->
用户名 :
<input type="text" name="name" value="" />
<!--输入密码-->
<td>密码 :
<td><input type="password",name="password" value=""/>
<button type="submit">登录
<!--如果没有账号,则跳转到注册页面-->
没有账号?
<a href="register.html">注册
注册页面设计
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<!--
form标签就是表单
input type="text"输入文本
input type="password"输入密码
input input type="radio"输入单选框
input type="checkbox"输入多选框
<select><option></option><select>下拉选择列表
<textarea rows="10" cols="20">自我评价</textarea>输入文本框
input type="reset"重置
input type="submit"确认
-->
<!--提交表单,然后跳转到表单提交成功页面-->
<form action="registerSuccess.html">
<table align="center">
<tr>
<td>用户名:</td>
<td>
<input type="text" name="name" value=""/>
</td>
</tr>
<tr>
<td>密码:</td>
<td>
<input type="password" name="password" value=""/>
</td>
</tr>
<tr>
<td>确认密码:</td>
<td><input type="password" name="confirmPassword" value=""/></td>
</tr>
<tr>
<td>性别:</td>
<!--单选框,checked=“checked”设置默认选项-->
<td>
<input type="radio" name="sex" checked="checked"/>男
<input type="radio" name="sex"/>女
</td>
</tr>
<tr>
<!--多选框,同样可以用checked=“checked”设置默认选项-->
<td>兴趣爱好:</td>
<td>
<input type="checkbox" checked="checked"/>Java
<input type="checkbox"/>JavaScript
<input type="checkbox"/>C++
</td>
</tr>
<tr>
<!--下拉选择列表,可以通过selected=“selected”设置默认选项-->
<td>国籍:</td>
<td>
<select>
<option>中国</option>
<option selected="selected">日本</option>
<option>美国</option>
</select>
</td>
</tr>
<tr>
<td>自我评价:</td>
</tr>
<tr>
<!--文本输入框,可以通过设置cols来设置列的数目,通过rows设置行的数目-->
<td>
<textarea rows="10" cols="20">自我评价</textarea>
</td>
</tr>
<tr>
<!--type=“reset”重置所有输入-->
<td>
<input type="reset" value="重置">
</td>
<td>
<!--type=“submit”提交表单-->
<input type="submit" value="注册" >
</td>
</tr>
</table>
</form>
</body>
</html>
登录成功页面
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>登录成功</title>
</head>
<body>
<h1>
欢迎回来!!!
</h1>
</body>
</html>
注册成功页面
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<h1>
恭喜你已成功注册!!!
<a href="login.html">立即登录</a>
</h1>
</body>
</html>
