引导表行选择

Question

我似乎无法突出显示整个行。 当我将行标记为活动状态时，无论行上带有sorted_1类的行如何，都不会采用所选的突出显示。 即使在排序时手动设置单元格的背景也不会产生结果。 有什么想法吗？

             <table class="table table-bordered table-hover" id="accountTable">
                <thead>
                    <tr>
                        <th style="width: 50%;">Account Name
                        </th>
                        <th style="width: 50%;">Profit Center Number
                        </th>
                    </tr>
                </thead>
                <tbody>
                    <tr>
                        <td>Test Acct</td>
                        <td>XXXX99753</td>
                    </tr>
                    <tr>
                        <td>Test Acct 2</td>
                        <td>XXXX99885</td>
                    </tr>
                    <tr>
                        <td>Account 3</td>
                        <td>XXXX99885</td>
                    </tr>
                    <tr>
                        <td>Z Account</td>
                        <td>XXXX99885</td>
                    </tr>
                </tbody>
            </table>

另外，当然，请在我的脚本部分的结尾处调用此函数。

$('#accountTable').dataTable();

Answer 1

table.dataTable td.sorting_1,
table.dataTable td.sorting_2,
table.dataTable td.sorting_3,
table.dataTable th.sorting_1,
table.dataTable th.sorting_2,
table.dataTable th.sorting_3 {
    background: none !important;
}

看来这就是问题所在。 我正在使用这些项目中都有的内部样式表，它有一个可爱的部分：/

Answer 2

为td添加样式定义：

.active td {
  background: red !important;
}

您也可以添加此样式

tr:not(.active):hover td {
  background: #e99 !important;
}

jsfiddle