极点网络 发表于 2024-6-13 22:44:57

【CSS美化专题】EL 树型控件添加虚线详解

本帖最后由 极点网络 于 2024-6-14 18:26 编辑

因自己需要，勿喷，留着自己备用，怕忘记了





    .el-tree > .el-tree-node:after {
    border-top: none;
    }
    .el-tree-node {
    position: relative;
    padding-left: 16px;
    }
    .el-tree-node__expand-icon{
    color: #606266;
    }
    .el-tree-node__children {
    padding-left: 16px;
    }
    .el-tree-node :last-child:before {
    height: 38px;
    }
    .el-tree > .el-tree-node:before {
    border-left: none;
    }
    .el-tree > .el-tree-node:after {
    border-top: none;
    }
    .el-tree-node:before {
    content: "";
    left: -4px;
    position: absolute;
    right: auto;
    border-width: 1px;
    }
    .el-tree-node:after {
    content: "";
    left: -4px;
    position: absolute;
    right: auto;
    border-width: 1px;
    }
    .el-tree-node:before {
    border-left: 1px dashed #606266;
    bottom: 0px;
    height: 100%;
    top: -26px;
    width: 1px;
    }
    .el-tree-node:after {
    border-top: 1px dashed #606266;
    height: 20px;
    top: 12px;
    width: 24px;
    }
    .el-tree-node__content{
      padding-left: 0px !important;
    }
    .el-tree-node__expand-icon.is-leaf {
      color: #e1e2e2;
    }







qweqwe123 发表于 2024-6-14 06:47:24

能发个deom吗 貌似复制过去没成功

追风 发表于 2024-6-14 10:24:21

是否有DEMO分享下，大佬;P

胡 发表于 2024-6-14 10:44:33

{:5_117:} 为大佬点赞

极点网络 发表于 2024-6-14 18:28:12

qweqwe123 发表于 2024-6-14 06:47
能发个deom吗 貌似复制过去没成功

deom 已经上传了

追风 发表于 7 天前

极点网络 发表于 2024-6-14 18:28
deom 已经上传了

有点影响拖拽的效果，是否可以优化一下？
页: [1]
查看完整版本: 【CSS美化专题】EL 树型控件添加虚线详解