如果表有多行，则添加底部边框线

Question

如果表有多行，我想添加底部边框线。如果表只有单行，则应隐藏底部边框。请指导我如何实现这一目标。请参阅下面的示例图片。

Answer 1

您可以使用last-of-type或last-child作为@David说，例如

table tr td {
    border-bottom: 1px solid #f00;
}

table tr:last-of-type td {
    border-bottom: 0;
}

Demo

Answer 2

最简单的方法是选择tr:last-child作为之前tr的兄弟姐妹：

tr + tr:last-child td {
    border-bottom-width: 0;
}

以上假设（从您的图片看起来）border-bottom位于td上，如果它位于tr本身，则：

tr + tr:last-child {
    border-bottom-width: 0;
}

如果border-bottom本身位于table，则需要使用JavaScript（因为CSS没有父选择器），因为您提供了jQuery作为问题的标记：

$('table').filter(function(){
    return $(this).find('tr').length < 2;
}).addClass('singleOrNoRows');

使用CSS：

.singleOrNoRows {
    border-bottom-width: 0;
}

Answer 3

以下是fiddle link

<强> HTML

<div class="wrapper">
<table width="100%" border="0" cellspacing="0" cellpadding="0">
    <tr>
        <td align="left" valign="top">sadfs</td>
    </tr>
    <tr>
        <td align="left" valign="top">sdaf</td>
    </tr>
    <tr>
        <td align="left" valign="top">sdaf</td>
    </tr>
    <tr>
        <td align="left" valign="top">sadf</td>
    </tr>
</table>
</div>

<强> CSS

*{
    padding:0;
    margin:0;
    }
body {
    font:normal 12px/17px Arial, Helvetica, sans-serif;
    color:#666666;
    }
ul, li {
    list-style:none;
    }
.wrapper {
    width:960px;
    margin:0 auto;
    }
table,thead,tbody,th,td,tr { 
    display: block;
    background-color:#f9f5f5;
}
table thead tr { 
    position: absolute;
    top: -9999px;
    left: -9999px;
}

table td { 
    border: none;
    border-bottom: 1px solid #e0e0e0; 
    margin:0 10px;
    padding:5px 10px;
}
table tr:last-of-type td {
    border-bottom:0;
    }