jQuery-更改特定行的边框

Question

我正在加载一个表，然后在表加载之后，我想在两个特定的行上放一个边框。每次加载表时，它们总是相同的行。下面的代码可以工作，但是在表行之间创建的缺省换行符会妨碍将边框设置为小于2px的值。使用2px的边框对我来说太重了，但是使用1px的边框不会显示在默认的黑线上。

我使用的代码:

    $('#table-selections tr:eq(5)').css('border-bottom','2px dashed black');
    $('#table-selections tr:eq(5)').css('border-top','2px dashed black');
    $('#table-selections tr:eq(17)').css('border-bottom','2px dashed black');

添加边框似乎不是一种优雅的方式，而且不会超过行之间的默认行。

编辑:

小提琴

显示1px不工作而2px工作

Answer 1

只需添加一些css

.table-condensed tr{
    display:table;
    width:100%; 

}

.table-condensed td{
     width: 100px; 
}

小提琴

Answer 2

我将对两种类型的边框使用两种不同的类，并在jQuery脚本中使用addClass和removeClass。

表的css是否包含border:2px！important；？

Answer 3

您没有得到预期的1px边框，因为css应用在每个td（边框顶部）。

在bootstarp.min.css中

.table thead > tr > th, .table tbody > tr > th, .table tfoot > tr > th, .table thead > tr > td, .table tbody > tr > td, .table tfoot > tr > td {
    border-top: 1px solid #DDDDDD;
    line-height: 1.42857;
    padding: 8px;
    vertical-align: top;
}

因此您必须手动从第三排移除车尾顶部

$('#table-selections tr:eq(2)').css('border-bottom', '1px dashed black');
$('#table-selections tr:eq(3) td').css('border-top', 'none');
$('#table-selections tr:eq(4)').css('border-top', '2px dashed black');

你可以在这里看到小提琴