用div,form制作登录页面，尽可能做得漂亮。
练习使用下拉列表选择框，无序列表，有序列表，定义列表。
观察常用网页的HTML元素，在实际的应用场景中，用已学的标签模仿制作。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>管理信息系统</title>
</head>
<body>
<h1>欢迎访问！</h1>
<h3>GZCC</h3>
<P>跳转链接</P>
<a href="http://www.gzcc.cn/">广州商学院
<br>
<img src="http://www.gzcc.cn/2016/images/banner.png" width="500" height="39" alt="gzcc.cn"/></a>
<hr>
<div id="container" style=" 400px">
<div id="header" style="background-color: aquamarine"><h2 align="center" style="margin-bottom: 0;">登录页面</h2></div>
<div id="content" style="background-color: yellow;height: 150px; 400px;float: left;">
<form action="">
用户名:<input type="" name="用户名" placeholder="请输入用户名"><br>
密 码:<input type="" name="密码" placeholder="请输入密码"><br>
<br>
<input type="radio"name="role" value="stu">学生
<input type="radio" name="role" value="tea">教师
<input type="radio" name="role" value="tea">游客<br>
<input type="button" value="登录">
<input type="button" value="取消">
<input type="button" value="重置">
</form>
</div>
<div id="footer" style="background-color: aquamarine;clear: both;text-align: center;">版权 © duym</div>
</div>
<hr>
<div id="container" style="400px">
<div id="header" style="background-color:aquamarine;"><h2 align="center" style="margin-bottom:0;">搜索页面</h2></div>
<div id="contant" style="background-color:yellow;height:220px;400px;float:left;">
<form action=" "...></form>
<form>
<select >
<option>学生</option>
<option>教师</option>
<option>游客</option>
</select>
</form>
<ul>
<li>学校简介</li>
<li>大事件</li>
<li>全景</li>
</ul>
<ol>
<li>金融学院</li>
<li>外国语学院</li>
<li>旅游学院</li>
</ol>
<div id="footer" style="background-color:aquamarine;clear:both;text-align:center;">版权© duym</div>
</body>
</html>
复制代码