乐趣区

关于element-ui:element中eldialog踩坑一

element 中 el-dialog 踩坑一

1. 开发环境 vue+element
2. 电脑系统 windows10 专业版
3. 在应用 vue+element 开发的过程中, 咱们可能会应用到 el-dialog, 上面是我对 el-dialog 分享, 心愿对你有所帮忙!
4. 在 template 中增加如下代码:

<el-dialog
   :visible.sync="centerDialogVisible"
    width="70%"
    center
 >
 </el-dialog>

5. 在 css 中增加如下代码:

// 笼罩默认高度和默认间距
.el-dialog {
  height: 90%;
  margin-top: 8vh !important;
}

// 批改两头模块的高度
.el-dialog__body {
  height: 94%;
  padding: 0 !important;
}
/* 笼罩 el-dialog 的默认高度 完结啦 */

/* 笼罩 el-dialog 默认的背景色 */
.el-dialog,
.el-pager li {background-image: url("../assets/images/nybj.png") !important;
  background-repeat: no-repeat;
}

// 留神 : el-dialog 的父级肯定要有宽和高, 不然不失效 

5. 效果图如下:

6. 本期的成果到了这里就完结啦, 是不是很 nice, 心愿对你有所帮忙, 让咱们一起致力走向巅峰!

退出移动版