Skip to content

B
bailun-login-page
Commit 6fce115d by zhangzhongjie
Options

登录页静态页面完成

parents
Showing with 173 additions and 0 deletions
css/login.css 0 → 100644
body,ul{
margin:0;
padding:0;
}
ul{list-style: none;}
.bailun-color{
color:#442F8D;
}
.copyright{
-webkit-transform: translateX(-50%);
-moz-transform: translateX(-50%);
-ms-transform: translateX(-50%);
-o-transform: translateX(-50%);
position: fixed;
bottom: 0;
left: 50%;
transform: translateX(-50%);
color:#ffffff;
font-size: 12px;
}
.lg-bg{
position: fixed;
left: 0;
right: 0;
bottom: 0;
top: 0;
z-index: -2;
background-image: url('../img/log_bg.png');
background-size:100%;
background-position: center;
background-repeat: no-repeat;
}
/* .lg-bg img{
width:100%;
height: 100%;
} */
.log-box{
background: #ffffff;
position: absolute;
left:100px;
top:100px;
}
.log-box::after{
content: '';
display: block;
clear: both;
}
.log-box .form{
position: absolute;
background: #ffffff;
padding:50px;
border-radius: 20px;
}
.log-box .log-col{
-webkit-box-shadow:0px 2px 2px #f2f1f7;
-ms-box-shadow: 0px 2px 2px #f2f1f7;
-o-box-shadow: 0px 2px 2px #f2f1f7;
-moz-box-shadow: 0px 2px 2px #f2f1f7;
width: 100%;
height: 40px;
box-shadow: 0px 2px 2px #f2f1f7;
margin-bottom: 40px;
border-radius: 6px;
width:280px;
}
.log-box img{
width:30px;
height:30px;
vertical-align: middle;
margin:0 12px;
}
.log-box .log-col input{
border:none;
outline: none;
}
.log-box .form .pro{
font-size: 25px;
}
.log-box .form .welcome{
font-size: 32px;
margin-bottom: 50px;
}
/* 下拉菜单处 */
.log-box .form .company{
display: flex;
justify-content: space-between;
align-items: center;
}
.log-box .form .company .company-name{
line-height: 40px;
margin-left:15px;
}
.log-box .form .arrow-down{
width:30px;
height:30px;
background: url('../img/arrow-down.png') no-repeat center;
background-size: 14px;
}
.log-box .form .drowMenu{
position: relative;
}
.log-box .drowDown{
position: absolute;
border:1px solid #442F8D;
background: #ffffff;
width:280px;
border-top: none;
}
.log-box .drowDown li{
padding-left: 15px;
}
.log-box .form .log-btn{
-webkit-box-shadow:0 0;
-ms-box-shadow:0 0;
-o-box-shadow: 0 0;
-moz-box-shadow: 0 0;
box-shadow: 0 0;
background-color:#442F8D;
color:#ffffff;
text-align: center;
line-height: 40px;
margin-bottom:0 ;
}
login.html 0 → 100644
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
<link rel="stylesheet" href="./css/login.css">
</head>
<body>
<div class="lg-bg">
<!-- <img src="./img/log_bg.png" alt=""> -->
</div>
<div class="log-box">
<div class="form">
<div class="pro bailun-color">百伦ERP</div>
<div class="welcome bailun-color">Welcome back</div>
<form>
<div class="uname log-col">
<img src="./img/uname.png" alt="">
<input type="text" placeholder="请输入用户账号" autofocus>
</div>
<div class="upwd log-col">
<img src="./img/upwd.png" alt="">
<input type="password" placeholder="请输入用户密码">
</div>
<div class="log-col dropMenu">
<div class="company">
<!-- 二级菜单 -->
<div class="company-name">广州百伦供应链有限公司</div>
<div class="arrow-down"></div>
</div>
<ul class="drowDown" style="display:none">
<li>百伦公司1</li>
<li>百伦公司1</li>
<li>百伦公司1</li>
<li>百伦公司1</li>
<li>百伦公司1</li>
<li>百伦公司1</li>
<li>百伦公司1</li>
</ul>
</div>
<div class="log-btn log-col">登录</div>
</form>
</div>
</div>
<div class="copyright">©2019 百伦 All rights reserved.</div>
</body>
</html>
\ No newline at end of file
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment