如何移除Kendo复选框蓝色边框及TreeView高亮边框

嘿，我来帮你搞定这两个Kendo UI的样式调整问题！下面是针对你需求的具体解决方案，直接用CSS就能轻松搞定：

TreeView的高亮边框一般是节点获得焦点或被选中时出现的默认样式，你可以通过覆盖Kendo的默认CSS类来去掉它：

/* 移除节点聚焦时的高亮外边框 */
.k-treeview .k-item:focus .k-link {
    outline: none !important;
    border-color: transparent !important; /* 若还有边框残留，加上这行 */
}

/* 可选：如果需要移除选中状态的背景和边框 */
.k-treeview .k-state-selected {
    border-color: transparent !important;
    background-color: transparent !important;
}

简单解释下：.k-item:focus .k-link是TreeView节点获得焦点时的样式容器，用outline: none就能去掉默认的聚焦外框；如果选中节点时还有边框残留，就调整.k-state-selected的样式。!important是为了确保自定义样式优先级高于Kendo的默认样式，要是你项目里有更高优先级的样式规则，也可以去掉它。

Kendo复选框的蓝色元素通常是聚焦时的阴影或选中时的边框，针对这两种情况，你可以用下面的CSS：

/* 移除复选框聚焦时的蓝色阴影边框 */
.k-checkbox:focus + .k-checkbox-label::before {
    box-shadow: none !important;
}

/* 移除复选框选中时的蓝色边框 */
.k-checkbox:checked + .k-checkbox-label::before {
    border-color: #ddd !important; /* 换成你想要的默认边框色，或者transparent完全隐藏 */
}

/* 可选：自定义复选框默认边框颜色，替换掉蓝色 */
.k-checkbox-label::before {
    border-color: #ddd !important;
}

说明一下：Kendo的复选框是通过label的伪元素::before来绘制样式的，上面的代码分别处理了聚焦和选中状态下的蓝色元素——如果蓝色是阴影效果就去掉box-shadow，如果是边框颜色就替换成你想要的值就行。

内容的提问来源于stack exchange，提问作者dscythe