如何從使用引導程序的劍道網格行中刪除懸停效果

Question

前幾天我問了一個關於在選定行上消除懸停效果的問題並得到了正確答案，現在我遇到了一個問題，因為我使用的是 kendo bootstrap css，現在消除選定行上的懸停效果現在不起作用，並且我嘗試了幾種不同的方法來改變懸停效果以保持與 k 狀態選擇的顏色相同，但沒有一個工作..

 $("#grid").kendoGrid({ columns: [{ field: "name" }, { field: "age" } ], dataSource: [{ name: "Jane Doe", age: 30 }, { name: "John Doe", age: 33 } ], selectable: "row" });

 .k-grid .k-state-selected { background: #ec971f; } .k-grid .k-state-selected:hover { background: #ec971f!important; color: #000; } .k-grid .table-hover tbody tr:hover td, .table-hover tbody tr:hover th { background: #ec971f !important; } .k-grid .table-hover tbody .k-state-selected:hover { background: #ec971f !important; }

 <link rel="stylesheet" href="https://kendo.cdn.telerik.com/2018.3.1017/styles/kendo.common-bootstrap.min.css" /> <link rel="stylesheet" href="https://kendo.cdn.telerik.com/2018.3.1017/styles/kendo.bootstrap.min.css" /> <script src="https://code.jquery.com/jquery-1.12.3.min.js"></script> <script src="https://kendo.cdn.telerik.com/2019.3.1023/js/angular.min.js"></script> <script src="https://kendo.cdn.telerik.com/2019.3.1023/js/jszip.min.js"></script> <script src="https://kendo.cdn.telerik.com/2019.3.1023/js/kendo.all.min.js"></script> <div id="grid"></div>

Answer 1

 $("#grid").kendoGrid({ columns: [{ field: "name" }, { field: "age" } ], dataSource: [{ name: "Jane Doe", age: 30 }, { name: "John Doe", age: 33 }, { name: "Jane Doe", age: 30 }, { name: "Jane Doe", age: 30 }, ], selectable: "row" });

 .k-grid tr:hover { background-color: transparent !important; } .k-grid tr.k-alt:hover { background-color: #f5f5f5 !important; }

 <link rel="stylesheet" href="https://kendo.cdn.telerik.com/2018.3.1017/styles/kendo.common-bootstrap.min.css" /> <link rel="stylesheet" href="https://kendo.cdn.telerik.com/2018.3.1017/styles/kendo.bootstrap.min.css" /> <script src="https://code.jquery.com/jquery-1.12.3.min.js"></script> <script src="https://kendo.cdn.telerik.com/2019.3.1023/js/angular.min.js"></script> <script src="https://kendo.cdn.telerik.com/2019.3.1023/js/jszip.min.js"></script> <script src="https://kendo.cdn.telerik.com/2019.3.1023/js/kendo.all.min.js"></script> <div id="grid"></div>