删除 twitter 引导表的第一行答案

【问题标题】：Remove the first line of a twitter bootstrap table删除 twitter 引导表的第一行
【发布时间】：2014-02-19 21:25:47
【问题描述】：

众所周知，当您使用 Twitter Bootstrap 获取表格时，您会得到如下结果：

是否可以删除表格的第一行，即“Abos Girolamo”上方的那一行？谢谢

更新：这是表的代码：

<table class="table table-no-border">
    <tbody>

      <tr>

        <td>Abos Girolamo</td>
      </tr>

      <tr>

        <td>Aboulker Isabelle</td>
      </tr>

      <tr>

        <td>Adam Adolphe</td>
      </tr>
</tbody>
</table>

【问题讨论】：

您需要提供更多信息。具体来说，您想使用什么技术来产生这种效果。在css中你可以使用first-child
我想用css来做
可以给我们这张表的源码吗？
我更新了代码
您说要删除
行，但它不在源代码中。

标签： html twitter-bootstrap html-table

【解决方案1】：

如果你想使用 jQuery：

$('#TableID tr:first-child').remove();

<html><body><table id='TableID'>
<tr>Abos Girolamo</tr>
<tr>Aboulker Isabelle</tr>
<tr>Adam Adolphe</tr>
</table></body></html>

【讨论】：

【解决方案2】：

在 CSS 中你需要类似的东西：


.table > tbody > tr:first-child {
   display: none;
}

http://jsfiddle.net/ahallicks/bwbXA/

【讨论】：

在你的标记之前添加，它需要额外的 tbody 选择器。更改并添加了小提琴
我不想删除第一行，而是行，第一行上方的图形线...
如果它是表中的第一个孩子，那仍然有效。该行是
标签吗？
哈...失败了。我以为你的意思是整个表行！对不起。

【解决方案3】：

.table > tbody > tr:first-child > td {
    border: none;
}

@import url('http://getbootstrap.com/dist/css/bootstrap.css');

table {
    margin-top: 50px;
}

.table > thead > tr:first-child > td, 
.table > tbody > tr:first-child > td {
    border: none;
}

<table class="table table-no-border">
    <tbody>

      <tr>

        <td>Abos Girolamo</td>
      </tr>

      <tr>

        <td>Aboulker Isabelle</td>
      </tr>

      <tr>

        <td>Adam Adolphe</td>
      </tr>
</tbody>
</table>

【讨论】：

对于未来的visotr，不要忘记删除第一个th的边框，如果需要.table > tbody > tr:first-child > th { border: none; }

【解决方案4】：

对于那些通过 Google 找到这个问题的人...

引导表假定您将在标记中使用thead，这就是存在顶行的原因。如果您有包含标题和不包含标题的混合表格，则可以使用以下 CSS 正确设置它们的样式。

/* Remove the top border when a table is missing the header */
.table > tbody > tr:first-child > td {
    border: none;
}

/* Include the border when there's a header */
.table > thead + tbody > tr:first-child > td {
    border-top: 1px solid #ddd;
}

http://jsfiddle.net/colinjmiller93/fwsmpu5u/1/

【讨论】：

【解决方案5】：

如果您只想对特定表执行此操作并且不希望附加 CSS 规则可能影响现有表的风险，我想添加另一种可能有用的方法：

将style="border-top: none" 添加到第一行的每个<td> 元素。

例如

<table class="table">
    <tbody>
        <tr>
            <td style="border-top: none">Abos Girolamo</td>
        </tr>
        <tr>
            <td>Aboulker Isabelle</td>
        </tr>
        <tr>
            <td>Adam Adolphe</td>
        </tr>
    </tbody>
</table>

【讨论】：

【解决方案6】：

其他一些答案对我不起作用，下面的风格对我有用 -

.table {
  border-top-style: hidden;
}

【讨论】：