尝试删除 bootstrap 3 table 中的水平线

Question

我正在 bootstrap 中制作一个 table 并且我正在尝试弄清楚如何删除出现在每一行顶部的边框。

我正在重新创建 Stack Overflow 主页并进行练习，我正在制作 table 热门问题。我为每个实际行使用 2 bootstrap 行。由于我使用 2 行显示为 1，因此我需要隐藏第 2 行的上边框。

我尝试了 2 种不同的 CSS 方法来尝试摆脱它，但无济于事。两者都与 html 一起显示在下面：

<style>

.2nd-line {
    border-top: none;
}

.borderless td, .borderless th {
    border: none;
}

</style>


<div class = "row-fluid"> <!-- begin row 1 -->
  <div class = "col-md-9">
    <div class = "panel-body">
      <table class="table borderless">
        <tr class="warning">
          <td>
            <div class = "col-md-1">
              <p class = "top-questions-stats">0</p>
            </div>
            <div class = "col-md-1">
              <p class = "top-questions-stats">1</p>
            </div>
            <div class = "col-md-1">
              <p class = "top-questions-stats">13</p>
            </div>
            <div class = "col-md-6">
              <a href = "" target = "blank"><h5>Clipping the required portion of the image using CSS</h5></a>
            </div>
          </td>
        </tr>
        <tr class="warning 2nd-line borderless">
          <td class = "2nd-line borderless">
            <div class = "col-md-1">
              <p class = "top-questions-stats">votes</p>
            </div>
            <div class = "col-md-1">
              <p class = "top-questions-stats">answer</p>
            </div>
            <div class = "col-md-1">
              <p class = "top-questions-stats">views</p>
            </div>
            <div class = "col-md-2">
              <p>tags</p>
            </div>
            <div class = "col-md-4">
              <p class = "asked">asked 29 secs ago Darryl Mendonez</p>
            </div>
          </td>
        </tr> <!-- end row 1 -->

Answer 1

将 !important 属性添加到您的第二个样式。

.borderless td, .borderless th {
    border: none !important;
}

Answer 2

.borderless > thead > tr > th,
.borderless > tbody > tr > th,
.borderless > tfoot > tr > th,
.borderless > thead > tr > td,
.borderless > tbody > tr > td,
.borderless > tfoot > tr > td {
  border-top: none;
}

这是没有 !important 标签的方法。

尝试删除 bootstrap 3 table 中的水平线

Trying to remove a horizontal line in a bootstrap 3 table

html-table

horizontal-line

twitter-bootstrap-3