美化elementUI滚动条样式

<el-dialog custom-class="edit-form-dialog">
</el-dialog>

使用custom-class属性给el-dialog对话框组件的body部分设置最大高度并修改body部分滚动条样式

/deep/ .edit-form-dialog {
    .el-dialog__body {
      /*给dialog__body设置最大高度并添加滚动条*/
      /*overflow-y:atuo;  添加纵向滚动条*/
      /*overflow-x:atuo;  添加横向滚动条*/
      max-height: 60vh;
      overflow: auto ;

      /*滚动条里面小方块*/
      &::-webkit-scrollbar-thumb {
        background-color: #EBEAEF;
        border-radius: 10px;
      }
      /*滚动条整体样式*/
      &::-webkit-scrollbar {
        width: 6px;
        height: 6px;
      }
      /*滚动条里面轨道*/
      &::-webkit-scrollbar-track {
        background: #FFFFFF;
        border-radius: 10px;
      }
    }



    .el-dialog__header {
    }
    .el-dialog__footer {
    }
  }

注：
&::属于sass语法，常规用于伪元素的sass写法，即&::before和&::after(等同于.xxxclass::before和.xxxclass::after)，伪元素用法如下：

elementUI修改内置样式方法如下