ztree树样式的设计

ztree的功能虽然很是强大，但是唯一有一点就是样式有点普通，所以如果我们需要修改样式，那么就只能进行样式重新覆盖了

样式代码，这些都是根据实际样式进行覆盖

/**
 * tree的选中样式
 */
.checkbox_true_full+a>span,.light .checkbox_true_part+a>span,
.checkbox_true_full_focus+a>span,.light .checkbox_true_part_focus+a>span{
    color:#00abf3;
}
.dark .checkbox_true_full+a>span,.dark .checkbox_true_part+a>span,
.dark .checkbox_true_full_focus+a>span,.dark .checkbox_true_part_focus+a>span{
    color:#fff !important;
}
.ztree li a.curSelectedNode {
    padding-top: 0px;
    background-color: #00abf3;
    color: #fff;
    border: 1px #00abf3 solid;
    height: 18px;
    text-decoration: none;
}
.checkbox_true_full+a>span,.light .checkbox_true_part+a>span,
.checkbox_true_full_focus+a>span,.light .checkbox_true_part_focus+a>span{
    color:#00abf3;
}
/*修改文件夹与文件的图标*/
/*  .ztree li span.button.ico_open, .ztree li span.button.ico_close{
    background: url(images/tree_file.png) 0 0 no-repeat;
}
.split-tip-cont .ztree li span.button.ico_docu{
    background: url(images/tree_folder.png) 0 0 no-repeat;
} */

.ztree li a.curSelectedNode span{ color:#fff !important;}

.glyphicon{top:0!important}

 

 

图标的修改，因为ztree有自己的图标，所以如果要改图标，最简单的方法就是将原始的图片改掉（可以用ps进行修改了）

路径在 ztree插件下面有一个 ztreeStyle的文件夹   ztree/zTreeStyle/img/zTreeStandard.png

 

原文件

转载于:https://www.cnblogs.com/pengfei25/p/9229084.html