Css 加入“；主动的；自定义剑道UI网格按钮的颜色

我正在尝试向剑道UI网格添加彩色自定义按钮

除了活动状态外，它工作得很好。背景色不会被覆盖

HTML:

<a class="k-button k-button-icontext k-grid-details" href="#">
    <span class=" "></span>
 Details</a>

.k-grid-details {
    color: #fff;
    padding-left: 10px;
    padding-right: 10px;
    width: 50px;
    border-color: #003399;
    background-color: #003399;
    background: linear-gradient(#003399, #000167);
}

    .k-grid-details:hover {
        border-color: #003399;
        color: #fff;
        background-color: #003399;
    }

    .k-grid-details .k-state-active,
    .k-grid-details:active {
        background-color: #003399;
    }

可能遗漏了什么

看看这个

您的问题是在

.k-grid-details

但是，当您悬停并激活

.k-grid-details

时，只需使用

背景色

，因此

背景

（包含

线性渐变（003399，#000167）

）将保持悬停和激活状态。因此，您必须将背景颜色和背景结合起来，使其成为简写，如下所示：

.k-grid-details:hover {
        background: #ff0 none;
}

.k-grid-details:active {
        background: #f00 none;
}

背景：#039线性梯度（#003399，#000167）

您可以查看更多有关背景速记的信息

然后在背景色之后的悬停和活动状态中，为线性渐变设置“无”，如下所示：

.k-grid-details:hover {
        background: #ff0 none;
}

.k-grid-details:active {
        background: #f00 none;
}