el-dialog嵌套,修改内层el-dialog样式(自定义样式)

el-dialog嵌套使用时,内层的el-dialog要添加append-to-body属性

给内层的el-dialog添加custom-class属性,添加自定义类名


    这是一段信息
    
      取 消
      确 定
    
  

然后使用不带scoped的style标签,书写格式如下:

.tree-cesium-container .el-dialog__header {
  padding: 0px;
}
.tree-cesium-container .el-dialog__headerbtn {
  top: 10px;
  right: 10px;
}

就可以对其样式进行修改了

el-dialog嵌套,修改内层el-dialog样式(自定义样式)_第1张图片

 大功告成!

-------------------------------------------------手动分割线-----------------------------------------------------------------

顺便再记录个一层的el-dialog怎么自定义样式

在el-dialog外层包裹一个div,自定义类名,这里的el-dialog没有append-to-body

这是一段信息 取 消 确 定

然后在带有scoped的style标签内修改样式就ok了

以上两种情况都不会影响其他的el-dialog,只对当前的奏效~

你可能感兴趣的:(vue.js,elementui,javascript)