el-dialog中内容自定义滚动条

简介: el-dialog中内容自定义滚动条

上代码

dialog中嵌套div,给div设置高度,并且overflow属性为auto,布局如下图:

 

   .sketch_content {
// 必须有高度 overflow 为自动
    overflow: auto;
    height: 434px;
    border-top: 1px solid #eff1f4;
    border-bottom: 1px solid #eff1f4;
    padding: 0px 30px 11px 27px;
    }
 
// 滚动条的样式,宽高分别对应横竖滚动条的尺寸
    .sketch_content::-webkit-scrollbar {
      width: 3px;
    }
 
// 滚动条里面默认的小方块,自定义样式
    .sketch_content::-webkit-scrollbar-thumb {
      background: #8798AF;
      border-radius: 2px;
    }
 
// 滚动条里面的轨道
    .sketch_content::-webkit-scrollbar-track {
      background: transparent;
    }


相关文章
|
前端开发
饿了么el-dialog自定义内容以及el-dialog自定义样式
饿了么el-dialog自定义内容以及el-dialog自定义样式
542 0
element 下拉菜单el-dropdown如何更改样式?
element 下拉菜单el-dropdown如何更改样式?
1098 0
|
8月前
|
前端开发
elementui的el-dialog组件与el-tabs同时用导致浏览器卡死的原因解决
elementui的el-dialog组件与el-tabs同时用导致浏览器卡死的原因解决
172 0
elementui中el-checkbox 选中时的详细介绍
elementui中el-checkbox 选中时的详细介绍
element-ui框架的el-dialog弹出框被遮罩层挡住了/el-drawer....会生成v-model元素的组件被遮罩层挡住
element-ui框架的el-dialog弹出框被遮罩层挡住了/el-drawer....会生成v-model元素的组件被遮罩层挡住
494 1
|
JavaScript
elementUI封装 el-dialog
elementUI封装 el-dialog
element-ui框架的el-dialog弹出框被遮罩层遮挡问题
element-ui框架的el-dialog弹出框被遮罩层遮挡问题
601 0
|
JavaScript
element-ui 的表格里面使用 el-popover 实现编辑弹层功能
element-ui 的表格里面使用 el-popover 实现编辑弹层功能
944 0
element-ui 的表格里面使用 el-popover 实现编辑弹层功能
elementui源码学习之仿写一个el-drawer
elementui源码学习之仿写一个el-drawer
313 0