vue-element-admin—登录页面添加自定义背景

一、效果图

初始效果：

更改背景后效果：

二、操作步骤

1、准备图片

2、更改代码

打开下面路径的 index.vue 文件：

vue-element-admin-master\src\views\login\index.vue

也就是登录页面。

 对 .login-container 样式代码块内代码做如下图所示修改（代码在图片下面）。首先注释以下代码：

 width: 100%;
 height: 100vh;
 overflow: hidden;
 background-color: $dark-bg-color;

然后在下面添加以下代码

 width: 100%;
 height: 100%;
 background-image: url('../../icons/login.png');
 background-size: cover;
 background-position: center;
 position: relative;

如果不显示请重新运行项目