1

我正在引导程序中制作一个表格,我试图弄清楚如何删除出现在每一行顶部的边框。

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

我尝试了 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 = "http://stackoverflow.com/questions/33545349/clipping-the-required-portion-of-the-image-using-css" 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 -->
4

2 回答 2

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 标签的方法。

于 2015-11-11T02:20:29.660 回答
1

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

.borderless td, .borderless th {
    border: none !important;
}
于 2015-11-09T03:51:57.833 回答