element-ui vue 结合制作一个后台登录界面

登录页面

一、定义全局样式设置

新建global.css全局样式文件并且在main.js中引入
代码:

html,body,#app{
  padding:0;
  margin:0;
  height:100%;
  width:100%;
  background-color: #6699ff;
}

element-ui vue 结合制作一个后台登录界面_第1张图片
element-ui vue 结合制作一个后台登录界面_第2张图片
检查
element-ui vue 结合制作一个后台登录界面_第3张图片

##二、在components中新建Login.vue

背景图片
element-ui vue 结合制作一个后台登录界面_第4张图片
logo图片

代码如下





效果展示
element-ui vue 结合制作一个后台登录界面_第5张图片

新手勿喷。。

你可能感兴趣的:(前端)