'commit'

2 years ago · 07bb8511cd
parent 4f07a1d8d8
commit 07bb8511cd
2 changed files with 120 additions and 0 deletions
--- a/WebRoot/view/tb/index.css
+++ b/WebRoot/view/tb/index.css
@ -0,0 +1,82 @@
+@import url(./base.less); /* 引入全局样式 */
+
+body {
+  background: url('../images/bg.png') no-repeat top / 10rem;
+}
+
+.layout {
+  .box {
+    width: 8.5rem;
+    height: 10.5rem;
+    background-color: #fff;
+    margin: 5rem auto 0;
+    border: 1px solid #f7f7f7;
+    border-radius: .4rem;
+    .user {
+      margin: 1.1rem .5rem .75rem;
+      input {
+        width: 7.5rem;
+        height: 1.25rem;
+        border-radius: .2rem;
+        font-size: .3rem;
+        text-indent: 1.22rem;
+        &:first-child {
+          margin-bottom: .4rem;
+        }
+      }
+      .usn {
+        background: #f8f8f8 url("../images/user.png") no-repeat 0.48rem ~"/"0.4rem;
+      }
+      .psw {
+        background: #f8f8f8 url("../images/lock.png") no-repeat 0.48rem ~"/"0.4rem;
+      }
+    }
+    .login {
+      margin: 0 .5rem .6rem;
+      width: 7.5rem;
+      height: 1.25rem;
+      border-radius: .65rem;
+      background-image: linear-gradient(to right, #a14ff2, #6e80ec);
+    }
+    .other {
+      display: flex;
+      justify-content: space-around;
+      font-size: .3rem;
+      margin-bottom: 1rem;
+      .register {
+        margin-left: -1.2rem;
+      }
+      .forget {
+        margin-right: -1.2rem;
+      }
+    }
+
+    .devision {
+      position: relative;
+      width: 6.8rem;
+      height: 1px;
+      background-color: #ccc;
+      margin: 0 auto;
+      &::after {
+        position: absolute;
+        left: 50%;
+        top: 50%;
+        transform: translate(-50%, -50%);
+        color: #ccc;
+        font-size: .32rem;
+        background-color: #fff;
+        padding: 0 .15rem;
+        content: '第三方账号登录';
+      }
+    }
+    .outreach {
+      display: flex;
+      justify-content: space-around;
+      margin-top: .8rem;
+      width: 100%;
+      > img {
+        width: 1.2rem;
+      }
+    }
+  }
+}
--- a/WebRoot/view/tb/test.html
+++ b/WebRoot/view/tb/test.html
@ -0,0 +1,38 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <meta
+      name="viewport"
+      content="width=device-width, initial-scale=1.0,maximum-scale=1.0, minimum-scale=1.0, user-scalable=no"
+    />
+    <title>Document</title>    
+    <link rel="stylesheet" href="./index.css" />
+  </head>
+
+  <body>
+      <div class="layout">
+          <div class="box">
+              <div class="user">
+                  <input type="text" placeholder="用户名/账号/手机号" class="usn" ></input>
+                  <input type="password" placeholder="请输入您的密码"
+                  class="psw"></input>
+              </div>
+              <button class="login">登录</button>
+
+              <div class="other">
+                <a href="#" class="register">注册账号</a>
+                <a href="#" class="forget">忘记密码</a>
+              </div>
+
+              <div class="devision"></div>
+              <div class="outreach">
+                <img src="./images/icon-1.png">
+                <img src="./images/icon-2.png">
+                <img src="./images/icon-3.png">
+              </div>
+          </div>
+      </div>
+  </body>
+</html>
+