如何添加背景颜色以及如何突出显示我正在使用数据表1.9.4版本的边框

Question

是否可以突出显示<tr>的边框，我们可以将背景颜色添加到表格内的同一<tr>吗？

Answer 1

根据this answer，如果在表格中设置tr，您可以设置border-collapse边框的样式。

CSS：

table {border-collapse:collapse;}
tr {border:2px solid black;}

HTML：

<table>
  <tr>
    <td>cell</td><td>cell</td><td>cell</td>
  </tr>
</table>

您可以在此fiddle中看到结果。

我不明白你关于tr bgcolors的问题，但上面的小提琴可能会给你答案。

Answer 2

这是一个“选择”功能，可突出显示带边框的整个行 - 保留.odd / .even个类：

table.dataTable tbody tr.selected td:first-child {
   border-left: 1px solid lime;
}
table.dataTable tr.selected td:last-child {
   border-right: 1px solid lime;
}
table.dataTable tbody tr.selected td {
   border-top: 1px solid lime;
   border-bottom: 1px solid lime; 
   background-color: yellow !important;
}
table.dataTable tbody tr.selected td:not(:first-child):not(:last-child) {
   border-left: 0px;
   border-right: 0px;  
}

$("#example").on('click', 'tbody td', function() {
    $(this).parent().toggleClass('selected');
});    

演示 - ＆gt;的 http://jsfiddle.net/z8bn8rj1/

原始回答。这有点棘手，因为CSS中border-color的{​​{1}}不支持<tr>。

首先删除.odd / .even类默认情况下，dataTables添加到表行，只需给asStripeClasses一个空数组：

var table = $('#example').dataTable({
   asStripeClasses : []
});

然后，这里有一个设置<tr>的石灰边框和背景颜色黄色的示例：

/* border-bottom of the headers, they appear as first row border-top */
table.dataTable thead th {
    border-bottom: 1px solid lime;
}    
/* set first column left border */
table.dataTable tbody td:first-child {
   border-left: 1px solid lime;
   border-top: 1px solid lime;
}
/* set last column right border */
table.dataTable td:last-child {
   border-right: 1px solid lime;
   border-top: 1px solid lime;
}
/* remove border between columns, alternatively set border as background-color */
table.dataTable tbody td:not(:first-child):not(:last-child) {
   border-top: 1px solid lime;
   border-left: 0x;
   border-right: 0px;  
}
/* set last row columns border-bottom */
table.dataTable tbody tr:last-child td {
    border-bottom: 1px solid lime;
}    
/* set all columns background-color */
table.dataTable tbody td {
    background-color: yellow;
} 

演示 - ＆gt;的 http://jsfiddle.net/jasjek8o/