用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>
原文:http://www.cnblogs.com/lishanting/p/7660376.html