优化登录页面

This commit is contained in:
hdm 2022-06-11 23:22:26 +08:00
parent c0faef4762
commit 0bd7ab0f1a

View File

@ -17,9 +17,9 @@
background-size: cover;
}
.container h2 {font-size: 36px;padding: 36px 0;font-weight: 500;}
.login {width: 400px;text-align: center;position: absolute;top: 50%;left: 50%;margin-top: -240px;margin-left: -200px;border-radius: 12px;box-shadow: 0 2px 6px rgba(92, 110, 136, .32);
.login {width: 360px;text-align: center;position: absolute;top: 50%;left: 50%;margin-top: -240px;margin-left: -180px;border-radius: 12px;box-shadow: 0 2px 6px rgba(92, 110, 136, .32);
}
.login .top {width: 400px;height: 117px;background-color: #fbbc05;border-radius: 12px 12px 0 0;line-height: 117px;text-align: center;overflow: hidden;
.login .top {width: 360px;height: 117px;background-color: #fbbc05;border-radius: 12px 12px 0 0;line-height: 117px;text-align: center;overflow: hidden;
-webkit-transform: rotate(0deg);
-moz-transform: rotate(0deg);
-ms-transform: rotate(0deg);
@ -28,11 +28,11 @@
}
.login .top .bg1 {display: inline-block;width: 72px;height: 72px;background: #fff;opacity: .1;border-radius: 0 72px 0 0;position: absolute;left: 0;top: 42px;}
.login .top .bg2 {display: inline-block;width: 92px;height: 92px;background: #fff;opacity: .1;border-radius: 50%;position: absolute;right: -16px;top: -16px;}
.login .bottom {background-color: #fff;padding: 30px 25px;border-radius: 0 0 12px 12px;}
.login .bottom {background-color: #fff;padding:26px 24px;border-radius: 0 0 12px 12px;}
.layui-input,.layui-textarea {height: 44px;border: 1px solid #ddd;}
.captcha_img img{width:142px; height:44px; cursor:pointer;}
.layui-btn {height: 48px;font-size: 16px;margin-top: 5px;background-color: #FF6347!important}
.layui-btn {height: 45px;font-size: 16px;margin-top: 6px;background-color: #FF6347!important}
.foot {position: absolute; font-size: 12px; bottom: 28px;text-align: center;width: 100%;color: #458BF3;}
</style>
</head>
@ -53,7 +53,7 @@
<input type="password" name="password" lay-verify="required" value="" placeholder="请输入密码" lay-reqText="请输入密码" autocomplete="off" class="layui-input">
</div>
<div class="layui-form-item">
<div class="layui-input-inline" style="width:188px;">
<div class="layui-input-inline" style="width:158px;">
<input type="text" name="captcha" lay-verify="required" placeholder="验证码" lay-reqText="请输入验证码" autocomplete="off" class="layui-input">
</div>
<div class="layui-input-inline captcha_img" style="width:142px; height:44px; margin-right:0">