Vue ElementUI el-scrollbar 嵌套 el-tree 出现适宜横向纵向滚动条的方案
Vue页面里部分相关代码。
示例代码:
Vue页面里部分相关代码。
示例代码:
.list-tree-div {width: 232px;overflow: auto;background: none;flex-grow: 1;display: flex;.el-scrollbar {display: flex;padding: 2.6px 16px 16px 0;width: 232px;.el-scrollbar__wrap {overflow-x: hidden;overflow-y: auto;min-width: 250px;.el-tree.filter-tree {.el-tree-node{> .el-tree-node__content{/* 让纵向滚动条与内容最右边界限之间留有8px的宽度,使效果更好看。 */padding: 0 8px 0 0;.el-tree-node__expand-icon{margin:-2 0 0 3px;padding: 0;}> label.el-checkbox{margin-right: 4px;margin-bottom: 0px;font-size: 12px;}.el-tree-node__label {font-size: 12px;line-height: 12px;}}.el-tree-node__children{/* 出现横轴滚动条 */display: inline-block;min-width: 100%;}}}}.el-scrollbar__bar {&.is-horizontal{bottom:0;}&.is-vertical{right:0;}}}}
本文来自互联网用户投稿,文章观点仅代表作者本人,不代表本站立场,不承担相关法律责任。如若转载,请注明出处。 如若内容造成侵权/违法违规/事实不符,请点击【内容举报】进行投诉反馈!
