登录页添加静态图片

src/assets/css/login.scss

@@ -2,7 +2,8 @@ $bg:#2d3a4b;
 $dark_gray:#889aa4;
 $light_gray:#eee;
 .login-container{
-  // background: url('../../../public/static/images/login.png');
+  background:url("/static/img/login.jpg") center center no-repeat;
+  background-size:100% 100%;
   width: 100%;
   height: 330px;
   margin-top: 9%;

src/views/login.vue

@@ -1,20 +1,20 @@
 <template>
-<div class="login-container">
-  <div class="pic"> 
-    <img src="@/assets/images/log3.png">
+  <div class="login-container">
+    <div class="pic">
+      <img src="@/assets/images/log3.png">
+    </div>
+    <el-form :model="loginForm" label-width="80px" class="tab">
+      <el-form-item>
+        <el-input prefix-icon="el-icon-user" placeholder="请输入内容" v-model="loginForm.username" clearable></el-input>
+      </el-form-item>
+      <el-form-item>
+        <el-input prefix-icon="el-icon-lock" placeholder="请输入密码" v-model="loginForm.password" show-password></el-input>
+      </el-form-item>
+      <el-form-item class="btn">
+        <el-button size="medium" icon="el-icon-s-promotion" type="primary" @click="login">登录</el-button>
+      </el-form-item>
+    </el-form>
   </div>
-  <el-form :model="loginForm" label-width="80px" class="tab">
-    <el-form-item>
-      <el-input prefix-icon="el-icon-user" placeholder="请输入内容" v-model="loginForm.username" clearable></el-input>
-    </el-form-item>
-    <el-form-item >
-      <el-input prefix-icon="el-icon-lock" placeholder="请输入密码" v-model="loginForm.password" show-password></el-input>
-    </el-form-item>
-    <el-form-item class="btn">
-      <el-button size="medium" icon="el-icon-s-promotion" type="primary" @click="login">登录</el-button>
-    </el-form-item>
-  </el-form>
-</div>
 </template>
 
 <script>
@@ -23,5 +23,5 @@ export default login;
 </script>
 
 <style lang="scss" scoped>
-@import "@assets/css/login.scss";
+@import '@assets/css/login.scss';
 </style>