更改

src/views/Login/Login.vue

@@ -118,7 +118,7 @@ export default {
   right: 0;
   bottom: 0;
   background: url("./img/login.png") no-repeat;
-  background-size: cover;
+  background-size: 100% 100%;
 }
 
 
@@ -136,7 +136,8 @@ export default {
 }
 
 .tab-wrapper {
-  width: 500px;
+  width: 100%;
+  height: 100%;
   text-align: center;
 
   .tab2 {
@@ -149,10 +150,10 @@ export default {
   }
 
   .tab1, .tab2 {
-    width: 104px;
+    width: 100%;
     font-size: 24px !important;
     font-weight: 1000;
-    height: 50px;
+    height: 100%;
     color: #c4c4c4;
     display: inline;
 
@@ -167,11 +168,11 @@ export default {
   }
 
   .active1 {
-    left: 147px;
+    left: 28%;
   }
 
   .active2 {
-    left: 310px;
+    left: 62%;
   }
 
   .line {
@@ -183,16 +184,12 @@ export default {
 
 
 .tab {
-  width: 500px;
-  height: 603px;
+  width: 27%;
+  height: 60%;
   position: absolute;
-  top: 284px;
+  top: 26%;
   left: 12%;
 
-  .phone {
-    display: inline;
-    margin-bottom: 30px;
-  }
 
   .phone-img {
     position: absolute;
@@ -215,8 +212,6 @@ export default {
   text-align: left;
 }
 
-.input-div {
-}
 
 .code {
   width: 100px;
@@ -227,7 +222,7 @@ export default {
 .left, .right {
   position: absolute;
   color: #fff;
-  bottom: 15px;
+  bottom: 10%;
   font-size: 20px;
   color: rgb(0, 255, 231);
 }
@@ -261,7 +256,7 @@ export default {
 }
 
 /deep/ .el-checkbox {
-  margin-top: 33px;
+  margin-top: 5%;
   font-size: 20px;
 }
 
@@ -280,7 +275,7 @@ export default {
 }
 
 /deep/ .el-input__clear {
-  height: 163px;
+  height: 140%;
   font-size: 20px;
 }
 
@@ -290,12 +285,11 @@ export default {
 }
 
 /deep/ .el-button {
-  height: 50px;
-  width: 188px;
+  height: 30%;
+  width: 38%;
   font-weight: bold;
   font-size: 23px;
-  margin-top: 71px;
-
+  margin-top: 13%;
 }
 
 /deep/ .el-button--default {