用div,form制作登录页面，尽可能做得漂亮。
练习使用下拉列表选择框，无序列表，有序列表，定义列表。
观察常用网页的HTML元素，在实际的应用场景中，用已学的标签模仿制作。
<!DOCTYPE html><html lang="en"><head> ???<meta charset="UTF-8"> ???<title>MIS问答平台</title></head><body><h1>欢迎来访</h1><h6>一颗赛艇</h6><h4>2015</h4><p></p><div id="container" style="width: 400px"> ???<div id="header" style="background-color: aquamarine"><h2 align="center" style="margin-bottom: 0;">登录</h2></div><div id="content" style="background-color: antiquewhite;height: 150px;width: 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: aliceblue;clear: both;text-align: center;">版权 ? duym</div></div><hr><div id="container" style="width: 400px"> ???<div id="header" style="background-color: aquamarine"><h2 align="center" style="margin-bottom: 0;">搜索</h2></div><div id="content" style="background-color: antiquewhite;height: 150px;width: 400px;float: left;"><form> ???<select> ???????<option>问答</option> ???????<option>收藏</option> ???</select> ???</form> ???<ul> ???????<li>python</li> ???????<li>css</li> ???</ul> ???<ol> ???????<li>广州商学院</li> ???????<li>信息技术与工程学院</li> ???</ol> ???<div id="footer" style="background-color: aliceblue;clear: both;text-align: center;">版权 ? duym</div></div><hr> ???<div id="container" style="width: 400px"> ???<div id="header" style="background-color: aquamarine"><h2 align="center" style="margin-bottom: 0;">项目</h2></div><div id="content" style="background-color: antiquewhite;height: 150px;width: 400px;float: left;"> ???<dl> ???????<dt>项目一</dt> ?????????<dd>描述项目</dd> ???????<dt>项目二</dt> ?????????<dd>描述项目</dd> ???</dl> ???</div> ???<div id="footer" style="background-color: aliceblue;clear: both;text-align: center;">版权 ? duym</div></div> ???<br><P>友情链接</P> ?<a href="http://www.gzcc.cn/">广州商学院<br> ?????<img src="http://www.gzcc.cn/2016/images/banner.png" width="258" height="39" alt="gzcc.cn"/></a>></body></html>
web基础，用html元素制作web页面
原文地址：http://www.cnblogs.com/acef/p/7662245.html