login.html页面抽取css
parent
f3b7d2703d
commit
7f68fbb423
|
|
@ -0,0 +1,71 @@
|
||||||
|
body {
|
||||||
|
background: url("../images/bg.png") no-repeat center center fixed ;
|
||||||
|
background-size: cover;
|
||||||
|
}
|
||||||
|
|
||||||
|
.login-box {
|
||||||
|
width: 300px;
|
||||||
|
height: 300px;
|
||||||
|
border: 1px solid #1a312c;
|
||||||
|
position: absolute;
|
||||||
|
left: 50%;
|
||||||
|
top: 50%;
|
||||||
|
margin-left: -150px;
|
||||||
|
margin-top: -150px;
|
||||||
|
border-radius: 5px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.head {
|
||||||
|
width: 100px;
|
||||||
|
height: 100px;
|
||||||
|
border-radius: 50%;
|
||||||
|
position: absolute;
|
||||||
|
top: -96px;
|
||||||
|
left: 50%;
|
||||||
|
margin-left: -50px;
|
||||||
|
background: url("../images/ok.png");
|
||||||
|
background-size: cover;
|
||||||
|
}
|
||||||
|
|
||||||
|
.input-box {
|
||||||
|
margin: 10px 10px 10px 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.input-box input {
|
||||||
|
margin-top: 20px;
|
||||||
|
border-radius: 5px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.input-box input[type="submit"] {
|
||||||
|
background-color: #189F92;
|
||||||
|
width: 100%;
|
||||||
|
border: none;
|
||||||
|
outline: none;
|
||||||
|
cursor: pointer;
|
||||||
|
color: #fff;
|
||||||
|
padding-top: 8px;
|
||||||
|
padding-bottom: 8px;
|
||||||
|
font-size: 18px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.input-box .remember-me {
|
||||||
|
margin-top: 20px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.input-box .remember-me .layui-form-switch {
|
||||||
|
margin-top: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.input-box .oauth {
|
||||||
|
margin-top: 20px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.input-box .oauth i {
|
||||||
|
cursor: pointer;
|
||||||
|
font-size: 28px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.copyright {
|
||||||
|
margin: 10px 10px 10px 10px;
|
||||||
|
font-size: 12px;
|
||||||
|
}
|
||||||
74
login.html
74
login.html
|
|
@ -10,79 +10,7 @@
|
||||||
<link rel="stylesheet" href="lib/layui/css/layui.css">
|
<link rel="stylesheet" href="lib/layui/css/layui.css">
|
||||||
<link rel="stylesheet" href="//at.alicdn.com/t/font_693759_y9sqpclnwsd.css">
|
<link rel="stylesheet" href="//at.alicdn.com/t/font_693759_y9sqpclnwsd.css">
|
||||||
<link rel="stylesheet" href="https://cdn.bootcss.com/animate.css/3.5.2/animate.min.css"/>
|
<link rel="stylesheet" href="https://cdn.bootcss.com/animate.css/3.5.2/animate.min.css"/>
|
||||||
<style>
|
<link rel="stylesheet" href="css/login.css"/>
|
||||||
body {
|
|
||||||
background: url("images/bg.png") no-repeat center center fixed ;
|
|
||||||
background-size: cover;
|
|
||||||
}
|
|
||||||
|
|
||||||
.login-box {
|
|
||||||
width: 300px;
|
|
||||||
height: 300px;
|
|
||||||
border: 1px solid #1a312c;
|
|
||||||
position: absolute;
|
|
||||||
left: 50%;
|
|
||||||
top: 50%;
|
|
||||||
margin-left: -150px;
|
|
||||||
margin-top: -150px;
|
|
||||||
border-radius: 5px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.head {
|
|
||||||
width: 100px;
|
|
||||||
height: 100px;
|
|
||||||
border-radius: 50%;
|
|
||||||
position: absolute;
|
|
||||||
top: -96px;
|
|
||||||
left: 50%;
|
|
||||||
margin-left: -50px;
|
|
||||||
background: url("images/ok.png");
|
|
||||||
background-size: cover;
|
|
||||||
}
|
|
||||||
|
|
||||||
.input-box {
|
|
||||||
margin: 10px 10px 10px 10px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.input-box input {
|
|
||||||
margin-top: 20px;
|
|
||||||
border-radius: 5px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.input-box input[type="submit"] {
|
|
||||||
background-color: #189F92;
|
|
||||||
width: 100%;
|
|
||||||
border: none;
|
|
||||||
outline: none;
|
|
||||||
cursor: pointer;
|
|
||||||
color: #fff;
|
|
||||||
padding-top: 8px;
|
|
||||||
padding-bottom: 8px;
|
|
||||||
font-size: 18px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.input-box .remember-me {
|
|
||||||
margin-top: 20px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.input-box .remember-me .layui-form-switch {
|
|
||||||
margin-top: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
.input-box .oauth {
|
|
||||||
margin-top: 20px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.input-box .oauth i {
|
|
||||||
cursor: pointer;
|
|
||||||
font-size: 28px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.copyright {
|
|
||||||
margin: 10px 10px 10px 10px;
|
|
||||||
font-size: 12px;
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
<div class="login-box animated rotateIn">
|
<div class="login-box animated rotateIn">
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue