Question

我正在尝试删除kendoui treeview component上的悬停样式，以便当您将鼠标悬停在树视图中的某个项目上时，它没有边框/背景图像等。我已经删除了除边框之外的所有内容看起来有些其他风格在起作用，我似乎找不到。到目前为止，这是我的CSS ...（除了默认主题）

  .k-treeview .k-in.k-state-hover{
    background-image:none;
    background-color:#fff;border:none;


}

.k-treeview .k-in.k-state-selected{
    background-image:none;
    background-color:#fff;color:#000;border:none;}

目前它只显示一个看起来是黑色的边框，而不是之前我添加上面样式的灰色边框...任何想法我能做些什么来摆脱这个顽固的边界？

Answer 1

通过在页面上添加此样式，我可以让它做我想要的。我认为这部分与css在同一页面上的多个不同sharepoint webparts中的加载（订单）有关......

.k-treeview .k-in.k-state-hover, .k-treeview .k-in.k-state-selected {
    border-style: none;
    border-width: 0;
    padding: 2px 4px 2px 3px;
}

Answer 2

再加上.k-state-disabled的使用，似乎我可能找到了一个稍好的CSS解决方案。

节点根本不移动，看起来完全禁用。

.k-treeview .k-in.k-state-hover,
.k-treeview .k-in.k-state-focused,
.k-treeview .k-in.k-state-selected {
    border-color:transparent;
    background-color:transparent;
}

我还添加了一些JavaScript来阻止扩展节点，并禁用复选框。

Answer 3

对于我来说，这有所帮助：

.k-window-action .k-state-hover {
    border: none;
    background: none;
}

P.S .：“边框颜色：透明”导致悬停时发生了轻微移动

在Kendo Treeview上删除悬停样式

3 个答案: