vue+css实现手机端移动端金色风格登录注册页面效果代码-html代码-BFW代码库

vue+css实现手机端移动端金色风格登录注册页面效果代码

代码语言：html

代码描述：vue+css实现手机端移动端金色风格登录注册页面效果代码

下面为部分代码预览，完整代码请点击下载或在bfwstudio webide中打开

<!DOCTYPE html>
<html>

<head>
    <meta charset="UTF-8">
    <title>登陆</title>
    <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
    <style>
        *{margin: 0;padding: 0;border: 0;list-style: none;text-decoration: none;color: inherit;font-weight: normal;font-family: "微软雅黑";box-sizing: border-box;font-style: normal;outline: none;-webkit-tap-highlight-color: transparent;}
    html{width: 100%;height: 100%;}
    body{width: 100%;height: 100%;overflow-x: hidden;background: linear-gradient(180deg,#42454e,#42454e,#1f1f21);background-size:100% 100%;background-color: #1f1f21;}
    img{vertical-align: top;max-width: 100%;}
    .logo{text-align: center;padding-top: 1.2rem;padding-bottom: 1.35rem;}
    .logo img{width: 3.4rem;}
    /* 表单区 */
    .content{width: 100%;height: auto;overflow: hidden;padding: 0 1.1rem;}
    .content .form{width: 100%;height: auto;overflow: hidden;}
    .content .form .item{width: 100%;height: 1.05rem;display: flex;justify-content: center;align-items: flex-end;border-bottom: .01rem solid #ffdeae;padding-bottom: .1rem;box-shadow: 0 .1rem .2rem rgba(0,0,0,.1);}
    .content .form .item i{flex-shrink: 0;width: .27rem;height: .85rem;}
    .content .form .item i.user{background: url(//repo.bfw.wiki/bfwrepo/images/app/login/icon-user.png) center bottom .1rem no-repeat;background-size: .26rem;}
    .content .form .item i.lock{background: url(//repo.bfw.wiki/bfwrepo/images/app/login/icon-lock.png) center bottom .1rem no-repeat;background-size: .27rem;}
    .content .form .item input{height: .5rem;width: 2rem;padding:0 0 0 .25rem;.........完整代码请登录后点击上方下载按钮下载查看