<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>注册页面</title>
<style type="text/css">
* {
margin: 0px;
padding: 0px;
}
a:visited, a:link, a:active {
text-decoration:none;
color:#036;
}
a:hover {
color:#09C;
text-decoration:underline;
}
body {
font-size:12px;
background:#73CFF1 url(images/wrapbg.jpg) center top no-repeat;
}
#container {
width: 800px;
margin-top: 0px;
margin-right: auto;
margin-bottom: 0px;
margin-left: auto;
}
#header {
height: 88px;
}
#content {
margin:0 auto;
width:720px;
padding:25px 0 25px 0;
}
#regtip {
background-image: url(images/regBg.png);
height: 56px;
padding-top: 25px;
padding-left: 53px;
color:#1E85AE;
}
#regtip h2 {
margin-bottom:3px;
line-height:20px;
color:#1E85AE;
font-family: "MicroSoft YaHei", "SimHei";
font-size:20px
}
#wrapper {
background-color: #FFF;
}
li {
list-style:none;
}
#formcontent li {
padding:12px 0;
clear:both;
}
#formcontent .l {
height:1em;
float:left;
width:150px;
text-align:right;
padding-right:10px;
font-weight:bold;
}
#formcontent .c {
/*height:1em;*/
}
#formcontent .r {
height:1em;
float:right;
width:220px;
color:#999
}
#shadow {
background-image: url(images/openShadow.png);
background-repeat: no-repeat;
height: 13px;
}
#footer {
font-family: Arial, Helvetica, sans-serif;
color: #FFF;
text-align: center;
padding: 20px;
}
</style>
</head>
<body>
<div id="container">
<div id="header"></div>
<form action="#" method="get" name="MyForm" id="myForm">
<div id="wrapper">
<div id="regtip">
<h2>即刻注册</h2>
<p>欢迎你的注册，请提供基本信息</p>
</div>
<div id="content">
<ul id="formcontent">
<li>
<div class="l">用户名</div>
<div class="r"><input type="image" src="images/check.png"/></div>
<div class="c">
<input type="text" name="username" id="username"/>
</div>
</li>
<li>
<div class="l">密码</div>
<div class="r">这里是一些提示信息</div>
<div class="c">
<input type="password" name="password" id="password"/>
</div>
</li>
<li>
<div class="l">确认密码</div>
<div class="r">这里是一些提示信息</div>
<div class="c">
<input type="password" name="password" id="password"/>
</div>
</li>
<li>
<div class="l">性别</div>
<div class="r">这里是一些提示信息</div>
<div class="c">
<label>
<input type="radio" name="sex" value="male" checked="checked"/>
男</label>
<label>
<input type="radio" name="sex" value="female"/>
女</label>
</div>
</li>
<li>
<div class="l">爱好</div>
<div class="r">这里是一些提示信息</div>
<div class="c">
<label>
<input type="checkbox" name="hobbie" value="football"/>
电影</label>
<label>
<input type="checkbox" name="hobbie" value="baskeball"/>
游戏</label>
<label>
<input type="checkbox" name="hobbie" value="volleyball"/>
编程</label>
</div>
</li>
<li>
<div class="l">出生年月</div>
<div class="r">这里是一些提示信息</div>
<div class="c">
<select name="n">
<option value="n1">1993</option>
<option value="n2">1994</option>
</select>
年
<select name="y">
<option value="y">12</option>
<option value="y">11</option>
</select>
月
<select name="r">
<option value="r">1</option>
<option value="r">2</option>
</select>
日
</div>
</li>
<li>
<div class="l">所在城市</div>
<div class="r">这里是一些提示信息</div>
<div class="c">
<select name="sheng">
<option value="sheng1">浙江</option>
<option value="sheng2">广东</option>
</select>
省
<select name="s" disabled="disabled">
<option value="s1">温州</option>
<option value="s2">杭州</option>
</select>
市
</div>
</li>
<li>
<div class="l">头像上传</div>
<div class="r">这里是一些提示信息</div>
<div class="c">
<input type="file" name="myFile" id="myFile"/>
</div>
</li>
<li>
<div class="l"></div>
<div class="r"></div>
<div class="c">
<label>
<input type="checkbox" name="hobbie2" value="tongyi" checked="checked"/>
同意<a href="#">条款</a></label>
</div>
</li>
<li>
<div class="l"></div>
<div class="r"></div>
<div class="c">
<input type="submit" value="登陆"/>
<input type="reset" value="重写"/>
<input type="button" value="返回"/>
</div>
</li>
</ul>
</div>
</div>
</form>
<div id="shadow"></div>
<div id="footer">Modified by <a href="http://www.weibo.com/clementyoung" target="_blank">@老杨Clement</a> © 2012 All Rights Reserved.</div>
</div>
</body>
</html>
