我有一个3 × 3的表。我需要一种方法为每一行tr的底部添加边界，并给它一个特定的颜色。
首先，我尝试了直接的方式，即:
<tr style="border-bottom:1pt solid black;">
但这并没有起作用。所以我添加了这样的CSS:
tr {
border-bottom: 1pt solid black;
}
但还是不管用。
我更喜欢使用CSS，因为这样我就不需要为每一行添加一个样式属性。 我还没有添加一个边界属性到<表>。我希望这不会影响我的CSS。
当前回答
将行显示为块。
tr {
display: block;
border-bottom: 1px solid #000;
}
简单地显示交替颜色:
tr.oddrow {
display: block;
border-bottom: 1px solid #F00;
}
其他回答
添加border-collapse:collapse到你的表格规则中:
table {
border-collapse: collapse;
}
例子
表{ border-collapse:崩溃; } tr { 底边:1pt纯黑色; } <表> A1 < tr > < td > < / td > < td > B1 < / td > < td > C1 < / td > < / tr > < tr > < td > A2 < / td > < td > B2 < / td > < td > C2 < / td > < / tr > < tr > < td > A2 < / td > < td > B2 < / td > < td > C2 < / td > < / tr > 表> < /
Link
我以前遇到过类似的问题。我不认为tr可以直接采取边界样式。我的解决方法是在行中设置tds的样式:
<tr class="border_bottom">
CSS:
tr.border_bottom td {
border-bottom: 1px solid black;
}
无CSS边框底部:
<table>
<thead>
<tr>
<th>Title</th>
</tr>
<tr>
<th>
<hr>
</th>
</tr>
</thead>
</table>
Use
border-collapse:像Nathan写的那样崩溃，你需要设置
Td {border-bottom: 1px solid #000;｝
你不能给tr元素加边框。这在firefox和IE 11中都适用:
<td style='border-bottom:1pt solid black'>
