用div,form制作登录页面，尽可能做得漂亮。
练习使用下拉列表选择框，无序列表，有序列表，定义列表。
观察常用网页的HTML元素，在实际的应用场景中，用已学的标签模仿制作。
<!DOCTYPE html><html lang="en"><head> ???<meta charset="UTF-8"> ???<title>MIS15</title></head><body bgcolor="#FFD9EC"><h1> 张艺兴生日快乐 ?</h1><h2>Happy Lay‘s Day</h2>><img src="http://wx1.sinaimg.cn/large/d56a59a4gy1fka4jk1p9rj21ck1wwk8i.jpg" width="300" height="450" ><div ?id="container" style="width:400px;" > ????<div id="header" style="background-color:palevioletred"><h2 align="center" style="margin-bottom: 0;"><font face="华文行楷" color="black" size="6" >登 录 </font></h2></div> ????????<div id="content" style="background-color:pink;width:400px;float:left;line-height:40px;"> ????????????<form > ????????????用户名:<br><input type="text" style="border-radius: 8px;height: 20px;width: 350px" name="user" PLACEHOLDER="请输入用户名"><br> ????????????密码:<a href="http://www.baidu.com"><font size="2" color="tomato"style="float: right" >忘记密码？</font> </a> ???????????????<br><input type="password" style="border-radius: 8px;height: 20px;width: 350px;" name="password" PLACEHOLDER="请输入密码"><br> ???????????????<div id="content" style="background-color:lightcoral;width:400px;float:left;line-height:40px;"> ???????????????????<input type="checkbox" value="Keep me logged in">下次自动登录<br> ???????????????????<input type="button" style="border-radius: 5px;background-color: seashell;height: 30px;width: 200px;margin-right: 10px;float: right"value="登录"> ????????????????</div> ??????????</form> ????????</div> ????<div id="footer" style="background-color:palevioletred;;clear:both;text-align:center;">版权?Judy-L</div></div><div ?id="container" style="width:400px;" > ???<div id="header" style="background-color:palevioletred"><h2 align="center" style="margin-bottom: 0;"><font face="华文行楷" color="black"size="6">搜 索</font></h2></div> ????????<div id="content" style="background-color:lightpink;;;width:400px;float:left;line-height:20px;"> ???????????范围：<select> ??????????????<option value="" style="color: #c2c2c2;">---请选择---</option> ???????????????<option>图片</option> ???????????????<option>饭拍视频</option> ???????????????<option>官方视频</option> ???????????????<option>音频</option> ???????????</select> ????????????<ul> ????????????<li>MV汇总</li> ????????????<li>花絮汇总</li> ????????????</ul> ????????????<ol> ????????????????<li>同人画作</li> ????????????????<li>饭制视频</li> ????????????</ol> ????????</div> ????????<div id="footer" style="background-color:palevioletred;clear:both;text-align:center;">版权?Judy-L</div> </div><br><p>友情链接</p><a href ="http://v.yinyuetai.com/video/3059775">张艺兴--SHEEP--MV</a></body> </html>
web基础，用html元素制作web页面
原文地址：http://www.cnblogs.com/lyx1997/p/7662811.html