用div,form制作登录页面，尽可能做得漂亮。
练习使用下拉列表选择框，无序列表，有序列表，定义列表。
观察常用网页的HTML元素，在实际的应用场景中，用已学的标签模仿制作。
?<!DOCTYPE html>
???????????<html lang="en">
????????<head>
??????<meta charset="UTF-8">
????????????<title>login in</title>
???????????</head>
?????????????????<body>
?????????????????????????<div ?id="container" style="width:400px " >
??????????????????<div id="header" style="background-color:skyblue;"><h2 align="center" style="margin-bottom:0;">用户登录</h2></div>
???????????<div class="login_con_left">
???????????????<div class="ewm_img">
???????????????????<img src="/pcsrc/images/login_left_bg.jpg" class="image">
???????????????????<a href="https://itunes.apple.com/app/apple-store/id910606347?pt=117124017&ct=msite_appbutton&mt=8" class="down_btn down_ios" target="_blank"></a>
???????????????????<a href="https://owhat.cn/download/owhat.apk" class="down_btn down_andriod" target="_blank"></a>
???????????????</div>
???????????</div>
?????????????????????????????<div id="header" style="background-color: skyblue"><h2 align="center"
??????????????????????????????<div class="login_con_right">
??????????????????????????????<section class="loginform ">
??????????????????????????????<section class="loginform_mid"><!--loginForm 输入框-->
??????????????????????????????<span id="logo_ani"><img src="https://qimage.owhat.cn/mobile/resource/login_ogirl@3x.gif" class="image"></span>
?????????????????????????????<section class="loginNei">
????????????????????????????<div class="each_ipt">
???????????????????????????Username:<input type="text" name="user"><br>
?????????????????????????????Password:<input type="password" name="password"><br>
??????????????????????????<br><input type="radio">老用户
??????????????????????????<input type="radio">新用户<br>
???????????????????????????<br><input type="button"value="登录">
???????????????????????????<input type="button"value="注册">
??????????????????????????????<div id="footer" style="background-color:#FFA500;clear:both;text-align:center;">版权 ? duym</div>
</div>
?<form>
???????????????????<div id="header" style="background-color: yellow">
???????????????????<select>
???????????????????<option>choose</option>
???????????????????<option>收藏</option>
???????????????????</select>
</form>
<ul>
???<li>日常监控</li>
???<li>日常管理</li>
???<li>主持管理</li>
???<li>入门教程</li>
???<li>活动资料</li>
</ul>
<ol>
???<li>日常监控</li>
???<li>日常管理</li>
???<li>主持管理</li>
???<li>入门教程</li>
???<li>活动资料</li>
</ol>
<dl>
???????<dt>选择</dt>
???????<dd><a href="http://xyq.163.com/mp006.html" target="_blank">吴亦凡</a>、Kris wu、</a></dd>
???</dl>
</body>
</html>
web基础，用html元素制作web页面
原文地址：http://www.cnblogs.com/lishanting/p/7660376.html