1

ブートストラップでテーブルを作成しています。すべての行の上部に表示される境界線を削除する方法を見つけようとしています。

スタック オーバーフローのホームページを練習用に再作成し、上位の質問の表を作成しています。実際の行ごとに2つのブートストラップ行を使用しています。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 = "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

2 番目のスタイルに !important 属性を追加します。

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