<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title></title>
<style type="text/css">
*{
padding: 0;
margin: 0;
}
.all{
border: 1px solid lightskyblue;
width: 300px;
height: 360px;
top: 100px;
right: 200px;
position: absolute;
}
.first{
width: 335px;
height: 50px;
}
.login,.passwd{
width: 160px;
height: 50px;
text-align: center;
line-height: 50px;
display:block;
font-family: "Lucida Blackletter", eufm10, blackletter;
color: gray;
float: left;
}
.login:hover{
color: black;
}
.passwd:hover{
color: black;
}
.second{
width: 330px;
height: 300px;
}
.number{
width: 280px;
height: 35px;
margin-top: 33px;
margin-left: 15px;
}
.password{
width: 280px;
height: 35px;
margin-top: 15px;
margin-left: 15px;
}
.bnext{
width: 20px;
height: 20px;
margin-top: 10px;
margin-left: 15px;
}
.lnext{
display: block;
width: 100px;
height: 10px;
margin-left: 45px;
margin-top: -22px;
font-size: small;
}
.oknext{
width: 280px;
height: 40px;
margin-top: 15px;
margin-left:15px;
border: 0;
background-color: deepskyblue;
font-size: large;
color: white;
font-family: "Monotype Corsiva", "Apple Chancery", "URW Chancery L", cursive;
}
.search{
font-size: small;
color: blue;
/*margin-top: 80px;*/
line-height: 50px;
margin-left: 110px;
}
.search:hover{
color: gray;
}
.forth{
width: 220px;
height: 50px;
/*line-height: 0px;*/
margin-top: -20px;
padding-left: 210px;
font-size: small;
color: blue;
}
.fog:hover{
color: gray;
}
/*.search{*/
/*width:100px ;*/
/*height: 10px;*/
/*margin-top: 45px ;*/
/*margin-left: 10px;*/
/*}*/
</style>
</head>
<body>
<div class="all">
<div class="first">
<span class="login">微信登录</span>
<span class="passwd">QQ登录</span>
</div>
<div class="second">
<input type="text" placeholder="支持QQ号/邮箱/手机号登录" class="number"><br/>
<input type="password" placeholder="QQ密码" class="password">
<input type="checkbox" class="bnext"><span class="lnext">下次自动登录</span>
<input type="button" value="登录" class="oknext">
<span class="search">扫码快捷登录</span>
</div>
<!--<div class="third">-->
<!--<span class="search">扫码快捷登录</span>-->
<!--</div>-->
<div class="forth">
<span class="fog">忘了密码?</span>
</div>
</div>
</body>
</html>
qq邮箱用户登陆页面
最新推荐文章于 2023-04-08 11:04:53 发布