Web本来是在7月份的时候开始学的,但由于那个老师走了,后来就先学android,现在android学习完,Web课程再次开始。
Web第一课学习html标签,学习完了就写一个登录页面。
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title></title>
<style>
*{margin:0; padding: 0;font-family: '微软雅黑';}
#a{
font-size:12px;
color:#666;
}
</style>
</head>
<body >
<div style="position: absolute;width:100%;height:100%;z-index:-1">
<img src="images/tk.jpg" height="100%" width="100%"/>
</div>
<div style="height:94px; width:956px;float:top;margin-left: 190px; background: #999;">
<img src="images/QQCreateUser.jpg" height="100%" width="100%"/>
</div>
<div style='height:900px; width:210px;float:left; margin-left: 190px;background: #e0eafa;' >
<div>
<img src="images/QQ账号.jpg" height="100%" width="100%"/>
</div>
<div>
<img src="images/邮箱账号.jpg" height="100%" width="100%"/>
</div>
<div style="margin-top: 100px;">
<img src="images/搜索你喜欢.jpg" height="100%" width="100%"/>
</div>
</div>
<div style='height:900px; width:746px;float:left;background-color:#f8fdff;' >
<div>
<img src="images/注册靓号.jpg" height="100%" width="100%"/>
</div>
<p style="margin-left: 70px;margin-top: 40px;font-size: 20px;">注册账号</p>
<hr style="margin-top: 20px;"/>
<div style="margin-top: 20px;margin-left: 72px;margin-bottom: 20px;">
昵称
<input type="text" style="height: 30px;width:200px;"/>
</div>
<div style="margin-top: 20px;margin-left: 72px;margin-bottom: 20px;">
密码
<input type="password"style="height: 30px;width:200px;"/>
</div>
<div style="margin-top: 20px;margin-left: 40px;margin-bottom: 20px;">
确认密码
<input type="password"style="height: 30px;width:200px;"/>
</div>
<div style="margin-top: 20px;margin-left: 72px;margin-bottom: 20px;">
性别
<input type="radio" value="man" name="sex"/>男
<input type="radio" value="woman" name="sex"/>女
</div>
<div style="margin-top: 20px;margin-left: 72px;margin-bottom: 20px;">
生日
<select name="cal">
<option value="value1" selected>公历</option>
<option value="value2" >农历</option>
</select>
<select name="year">
<option value="value1" selected>1995</option>
<option value="value2" >1996</option>
<option value="value3" >1997</option>
<option value="value4" >1998</option>
<option value="value5" >1999</option>
<option value="value6" >2000</option>
</select>
<select name="mouth">
<option value="value1" selected>1月</option>
<option value="value2">2月</option>
<option value="value3">3月</option>
<option value="value4">4月</option>
<option value="value5">5月</option>
<option value="value6">6月</option>
<option value="value7">7月</option>
<option value="value8">8月</option>
<option value="value9">9月</option>
<option value="value10">10月</option>
<option value="value11">11月</option>
<option value="value12">12月</option>
</select>
</div>
<div style="margin-top: 20px;margin-left: 55px;margin-bottom: 20px;">
所在地
<input type="text" style="height: 30px;width:200px;"/>
</div>
<div style="margin-top: 20px;margin-left: 40px;margin-bottom: 20px;">
手机号码
<input type="text" style="height: 30px;width:200px;"/>
</div>
<div style="margin-top: 20px;margin-left: 40px;margin-bottom: 20px;">
<input type="button" value="立即注册" style="margin-left: 70px;height: 30px;width:200px;"/>
</div>
</div>
<div align="center" style='height:94px; width:956px;float:left;background: #fff;margin-left: 190px' >
longsheng出品
</div>
</body>
</html>
大致就是用div来划分区域,然后添加图片,添加一些输入框,按钮与文字。
加油!