yu.css.ui/dist/component/tree.css

纯CSS通用UI模块和组件

.yu-checkbox{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Helvetica,PingFang SC,Hiragino Sans GB,Microsoft YaHei,SimSun,sans-serif;font-size:14px;color:#606266;cursor:pointer;margin-right:14px}.yu-checkbox>span{-moz-user-select:none;-webkit-user-select:none;-ms-user-select:none;user-select:none}.yu-checkbox>.checkbox{transition:background-color .4s;margin-right:4px;margin-bottom:-2px;display:inline-block;width:14px;height:14px;border:1px solid #dcdfe6;border-radius:2px;background-color:#fff}.yu-checkbox>.checkbox:hover{border:1px solid #409eff}.yu-checkbox>.checkbox>input{display:none}.yu-checkbox.checked>.checkbox{position:relative;border:1px solid #409eff;border-radius:2px;background-color:#409eff}.yu-checkbox.checked>.checkbox:after{content:"\00a0";display:inline-block;border:2px solid #fff;border-top-width:0;border-right-width:0;width:8px;height:4px;-webkit-transform:rotate(-50deg);position:absolute;top:3px;left:2px}.yu-checkbox.checked.disabled>.checkbox{border:1px solid #c0c4cc;background-color:#c0c4cc}.yu-checkbox.checked.disabled>.checkbox+span,.yu-checkbox.disabled{color:#c0c4cc}.yu-checkbox.disabled>.checkbox:hover{border:1px solid #dcdfe6}.yu-checkbox.control{display:block;margin-bottom:8px}.yu-checkbox.control.part>.checkbox{position:relative;border:1px solid #409eff;border-radius:2px;background-color:#409eff}.yu-checkbox.control.part>.checkbox+span{color:#409eff}.yu-checkbox.control.part>.checkbox:after{content:"\00a0";display:inline-block;border:2px solid #fff;border-top-width:0;border-right-width:0;border-left-width:0;width:10px;height:5px;-webkit-transform:rotate(180deg);position:absolute;top:6px;left:2px}.yu-checkbox-group{margin-bottom:14px}.yu-checkbox-group.vertical>.yu-checkbox{display:block;margin-bottom:14px}.yu-tree{font-size:0;padding-inline-start:0;padding:0;line-height:26px}.yu-tree>li{list-style:none}.yu-tree .child-tree{transition:height .4s ease;height:0;overflow:hidden;padding-inline-start:0;padding:0;display:block;margin-left:16px}.yu-tree .child-tree>li{list-style:none}.yu-tree .child-tree.last{margin-left:32px}.yu-tree .yu-checkbox{display:block}.yu-tree .leaf.active{display:inline-block;background-color:#e3f1ff}.yu-tree .leaf>i{vertical-align:top}.yu-tree .leaf>.yu-checkbox,.yu-tree .leaf>i{display:inline-block}.yu-tree .leaf label{font-size:14px;display:block;padding:0 4px}.yu-tree .leaf span{font-size:14px}.yu-tree .tree-title{display:flex}