css代码 ：
<style type="text/css">
body{
background-color: #EEF3FA;
font: "微软雅黑"12px;
margin: auto;
}
#conter{
background: #FFF;
1130px;
height: 800px;
margin: auto;
}
#code{
67px;
height: 35px;
position: absolute;
}
.loge{
height: 100px;
}
.loge img{
left: 100px;
padding-left:100px ;
}
.login{
background-color:#444444;
float: right;
height: 400px;
365px;
margin-top: 105px;
padding: 20px;
margin-right: 5px;
border-radius: 10px;
}
.banner{
height: 588px;
1130px;
background-image:url(../img/login_bg.jpg) ;
background-position-x: 25px;
}
#head{
height: 80px;
font-size: 18px;
color: #FFFFFF;
}
#vip{
font-size: 20px;
margin-left:20px ;
line-height: 60px;
}
#long{
font-size: 14px;
float: right;
line-height: 60px;
}
a{
text-decoration: none;
font-family: "微软雅黑";
color: red;
}
hr{
320px;
border-color: #FF6700;
}
input{
height: 30px;
200px;
margin: 10px;
}
.p1{
height: 30px;
}
.img{
margin-top: 10px;
position: absolute;
}
.input{
background-color: #FF6700;
240px;
height: 40px;
border: 0px;
color: #fff;
margin-left:60px ;
position: relative;
}
.even{
100px;
}
footer{
margin: auto;
1130px;
height: 100px;
text-align: center;
}
p{
font-size: 18px;
color: #000000;
}
.a1{
margin: 10px;
color: #000000;
}
</style>
html文档：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title></title>
<link rel="stylesheet" type="text/css" href="css/lg.css"/>
</head>
<body>
<div id="conter">
<div class="loge">
<img src="img/mistore_logo.png"/>
</div>
<div class="banner">
<div class="login">
<head>
<div id="head">
<span id="vip">
会员登录
</span>
<span id="long">
你还不是我们的会员？
<span id="reido">
<a href="#">立即注册</a>
</span>
</span>
<hr />
</div>
</head>
<form action="/stu" method="post">
用户名：
<input type="text" name="username" id="username" placeholder="请输入用户名"/><br/>
密 码：
<input type="password" name="password" id="password" placeholder="请输入密码"/>
<br/>
<p id="p1">
验证码：
<input class="even" type="text" placeholder="请输入验证码"/>
<img class="img" src="img/yanzhengma.jpg" height="35px" />
<br/>
</p>
<input class="input" type="submit" value="立即登录"/>
</form>
</div>
</div>
<footer>
<p>
<a class="a1" href="#">简体</a>|
<a class="a1" href="#">繁体</a>|
<a class="a1" href="#">English</a>|
<a class="a1" href="#">常见问题</a>
</p>
<a class="a1" href="#">小米公司版权所有—京ICP备10046444-<img src="img/ghs.png" />京公安王备11010802020134号—京ICP证110507号</a>
</footer>
</div>
</body>
</html>