如何从 HtmlTable 的一列和接触它的包含 table 的部分中删除边框？

Question

我需要从 html 的最后一列中删除边框线table。我在 table:

的最后一个 "column" (td) 上试过这个

<td class="nobordercell">Comments</td>

.nobordercell {
  border: none;
}

我也试过这个（border-collapse: collapse）：

<table class="middletable" border="1">
    <tr>
        . . .
        <td name="airfaredate1Comments" id="airfaredate1Comments" class="nobordercell">Comments</td>
    </tr>
    . . .

.middletable{
    width:99%;
    float:left;
    border-collapse:collapse;
}

边框唯一消失的边缘是底部。我意识到这是因为仍然显示的边框属于 table，而不是 td，但仍然需要知道如何仅在 td 所在的部分从 htmltable 中删除边框边界和它相交（或者会相交，如果显示 td 的边界）。

这是目前的样子：

...这就是我想要的样子：

Answer 1

一些简单的 css 和安排应该有助于解决问题，包括一个 JSFiddle。此外，必须从您的 HTML table 标签中删除边框：

.middletable{
    width:99%;
    float:left;
    border:none;
    border-collapse:collapse;
}

.bordercell{
    border:1px solid black;
}

.nobordercell {
  border: none;
}

<table class="middletable">
    <tr>
        <td name="airfaredate1Comments" id="airfaredate1Comments" class="bordercell">Comments</td>
                <td class="nobordercell">Comments</td>
    </tr>
        <tr>

        <td name="airfaredate1Comments" id="airfaredate1Comments" class="bordercell">Comments</td>
                    <td class="nobordercell">Comments</td>
    </tr>

        <tr>
        <td name="airfaredate1Comments" id="airfaredate1Comments" class="bordercell">Comments</td>
                    <td class="nobordercell">Comments</td>
    </tr>


</table>

https://jsfiddle.net/0v9vdd58/

Answer 2

您可以使用 :last-child 选择器：

table tr td:last-child {
border: none;
}

http://www.w3schools.com/cssref/sel_last-child.asp

Answer 3

您可以使用 CSS3 :last-of-type 选择器。

.middletable{
    width:99%;
    float:left;
    border-collapse:collapse;
}

.middletable td{
  border:1px solid black;
}

.middletable td:last-of-type{
    border:0px;
}

这是 HTML:

<table class="middletable">
    <tr>
        <td>A</td>
        <td>B</td>
        <td>C</td>
    </tr>
<table>

这里有一个 JSFiddle 来演示代码的运行：http://jsfiddle.net/5pt2axd1/

如何从 HtmlTable 的一列和接触它的包含 table 的部分中删除边框？

How can I remove the border from one column of an HtmlTable AND the part of the encompassing table that touches it?

html

css

html-table

border