html 删除twitter引导表的第一行

pprl5pva 于 2022-12-02 发布在其他

关注(0)|答案(7)|浏览(137)

大家都知道，当您使用Twitter Bootstrap获取表时，会得到如下结果：

是否可以删除表格的第一行，即“Abos Girolamo”上面的行？谢谢
UPDATE：下面是表的代码：

<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>

Html

来源：https://stackoverflow.com/questions/21407988/remove-the-first-line-of-a-twitter-bootstrap-table

7条答案

按热度按时间

c9qzyr3d1#

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

第一次

赞(0）回复(0）举报 2022-12-02

rqcrx0a62#

对于那些谁发现这个问题通过谷歌...
引导表假设您将在标记中使用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/

赞(0）回复(0）举报 2022-12-02

xpcnnkqh3#

如果要使用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>

赞(0）回复(0）举报 2022-12-02

slmsl1lt4#

在CSS中，您需要类似以下的内容：

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

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

赞(0）回复(0）举报 2022-12-02

mitkmikd5#

我想添加另一种可能性，如果您只想对特定的表执行此操作，并且不想让附加的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>

赞(0）回复(0）举报 2022-12-02

lnvxswe26#

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

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

赞(0）回复(0）举报 2022-12-02

wmvff8tz7#

如果您需要此选项：

代码如下：

table thead {
  background-color: var green !important;
}
table tr {
  border-bottom: 1.5px solid grey;
}
table thead tr:first-of-type {
  border-bottom: 0;
}
table tr th {
  border: 0;
}
table tr td {
  border: 0;
}

赞(0）回复(0）举报 2022-12-02

我来回答

html 删除twitter引导表的第一行

7条答案

相关问题

热门标签

最新问答