parent
cbea29a463
commit
5b415c1e3f
|
After Width: | Height: | Size: 412 KiB |
@ -0,0 +1,146 @@
|
|||||||
|
<!doctype html>
|
||||||
|
<html>
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8">
|
||||||
|
<title>登录</title>
|
||||||
|
<style type="text/css">
|
||||||
|
body{
|
||||||
|
margin: 0;
|
||||||
|
padding: 0;
|
||||||
|
background:url(' 图片/timg (4).jpg');
|
||||||
|
background-position: center;
|
||||||
|
background-repeat: no-repeat;
|
||||||
|
}
|
||||||
|
input{
|
||||||
|
display: inline-block;
|
||||||
|
background: #fff;
|
||||||
|
}
|
||||||
|
.xzc-title-box{
|
||||||
|
position: absolute;
|
||||||
|
width: 300px;
|
||||||
|
height: 50px;
|
||||||
|
margin-left: 100px;
|
||||||
|
margin-top: 5px;
|
||||||
|
text-align:center;
|
||||||
|
font-size: 28px;
|
||||||
|
font-weight: 800;
|
||||||
|
color: #ff5000;
|
||||||
|
line-height: 50px;
|
||||||
|
}
|
||||||
|
.xzc-login-box{
|
||||||
|
position: relative;
|
||||||
|
height: 400px;
|
||||||
|
width: 500px;
|
||||||
|
top: 50px;
|
||||||
|
margin: 0 auto;
|
||||||
|
z-index: 99999;
|
||||||
|
background: white;
|
||||||
|
border: 7px solid #ccc;
|
||||||
|
}
|
||||||
|
.xzc-username-box{
|
||||||
|
position: absolute;
|
||||||
|
width: 420px;
|
||||||
|
height: 40px;
|
||||||
|
line-height: 40px;
|
||||||
|
margin-top:100px;
|
||||||
|
margin-left:80px;
|
||||||
|
font-weight: 700;
|
||||||
|
}
|
||||||
|
.xzc-username-input{
|
||||||
|
display: inline-block;
|
||||||
|
margin-left: 5px;
|
||||||
|
/*background: green;*/
|
||||||
|
}
|
||||||
|
#username{
|
||||||
|
height: 35px;
|
||||||
|
width: 290px;
|
||||||
|
border: 2px solid #ccc;
|
||||||
|
border-radius: 5px;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
.xzc-userPassword-box{
|
||||||
|
position: absolute;
|
||||||
|
width: 420px;
|
||||||
|
height: 40px;
|
||||||
|
line-height: 40px;
|
||||||
|
margin-top:180px;
|
||||||
|
margin-left:80px;
|
||||||
|
font-weight: 700;
|
||||||
|
}
|
||||||
|
.xzc-userPassword-input{
|
||||||
|
display: inline-block;
|
||||||
|
margin-left: 20px;
|
||||||
|
}
|
||||||
|
#userPassword{
|
||||||
|
height: 35px;
|
||||||
|
width: 290px;
|
||||||
|
border: 2px solid #ccc;
|
||||||
|
border-radius: 5px;
|
||||||
|
}
|
||||||
|
.xzc-submit-box{
|
||||||
|
position:absolute;
|
||||||
|
width: 80px;
|
||||||
|
height: 40px;
|
||||||
|
line-height: 40px;
|
||||||
|
margin-top: 30px;
|
||||||
|
margin-left:100px;
|
||||||
|
border-radius: 5px;
|
||||||
|
background: grey;
|
||||||
|
}
|
||||||
|
#xzc-submit-button{
|
||||||
|
display: inline-block;
|
||||||
|
width: 80px;
|
||||||
|
height: 40px;
|
||||||
|
border-radius: 5px;
|
||||||
|
background: #C5C5F8;
|
||||||
|
}
|
||||||
|
.xzc-goGetback-box{
|
||||||
|
position:absolute;
|
||||||
|
width: 150px;
|
||||||
|
height: 20px;
|
||||||
|
margin-top: 80px;
|
||||||
|
margin-left:40px;
|
||||||
|
|
||||||
|
}
|
||||||
|
.xzc-goback-box
|
||||||
|
{
|
||||||
|
position:absolute;
|
||||||
|
margin-top: 80px;
|
||||||
|
margin-left:200px;
|
||||||
|
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
</head>
|
||||||
|
|
||||||
|
<body>
|
||||||
|
<div class=xzc-login-box>
|
||||||
|
<div class=xzc-title-box>
|
||||||
|
<span>约球吧</span>
|
||||||
|
</div>
|
||||||
|
<form action="#" method="post">
|
||||||
|
<div class="xzc-username-box">
|
||||||
|
<label for="username">用户名</label>
|
||||||
|
<div class="xzc-username-input">
|
||||||
|
<input type="text" id="username" name="username" placeholder="请输入用户名" />
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="xzc-userPassword-box">
|
||||||
|
<label for="userPassword">密码</label>
|
||||||
|
<div class="xzc-userPassword-input">
|
||||||
|
<input type="password" id="userPassword" name="userPassword" placeholder="请输入密码" />
|
||||||
|
</div>
|
||||||
|
<div class="xzc-submit-box">
|
||||||
|
<input id = "xzc-submit-button" type="submit" value="登录">
|
||||||
|
</div>
|
||||||
|
<div class="xzc-goGetback-box">
|
||||||
|
<a href="#" style="text-decoration: none;">忘记密码？去找回</a>
|
||||||
|
</div>
|
||||||
|
<div class=xzc-goback-box>
|
||||||
|
<a href="">返回上一页</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
Loading…
Reference in new issue