将边界隐藏在表格的特定线上,HTML CSS



我试图在此表上的特定行中摆脱边界。我想要一个男人和品牌舰队的行周围的边界,但没有中间的杂物线。由于某种原因,我无法使用TR类摆脱它。我犯的错误是什么?

table,
tr,
td,
th {
  border: 1px solid;
  border-collapse: collapse;
}
.noBorder {
  border: 0;
}
<table>
  <tr class="noBorder">
    <th>Men</th>
    <th></th>
    <th></th>
    <th></th>
    <th></th>
  </tr>
  <tr>
    <th>Brand</th>
    <th>Model</th>
    <th>Waist</th>
    <th>Lengths</th>
    <th>Quick Description </th>
  </tr>
  <tr class="noBorder">
    <th>Armada</th>
    <th></th>
    <th></th>
    <th></th>
    <th></th>
  </tr>
  <tr>
    <td>Armada</td>
    <td>Tracer 88</td>
    <td>88</td>
    <td>162, 172</td>
    <td>Cut with an 88mm waist width and Armada s snow-shedding Tapertop topsheet to minimize added weight from snow buildup, the Armada Tracer 88 Skis travel swiftly and efficiently uphill while the EST All-Mtn Rocker provides versatile performance on the
      journey down.</td>
  </tr>

您将边框应用于trth/td。因此,从tr删除边框是不够的。您还需要从th/td中将其删除,因此您可以这样调整CSS:

table,
tr,
td,
th {
  border: 1px solid;
  border-collapse: collapse;
}
.noBorder {
  border: 0;
}
.noBorder th,
.noBorder td {
  border: 0;
}
<table>
  <tr class="noBorder">
    <th>Men</th>
    <th></th>
    <th></th>
    <th></th>
    <th></th>
  </tr>
  <tr>
    <th>Brand</th>
    <th>Model</th>
    <th>Waist</th>
    <th>Lengths</th>
    <th>Quick Description </th>
  </tr>
  <tr class="noBorder">
    <th>Armada</th>
    <th></th>
    <th></th>
    <th></th>
    <th></th>
  </tr>
  <tr>
    <td>Armada</td>
    <td>Tracer 88</td>
    <td>88</td>
    <td>162, 172</td>
    <td>Cut with an 88mm waist width and Armada s snow-shedding Tapertop topsheet to minimize added weight from snow buildup, the Armada Tracer 88 Skis travel swiftly and efficiently uphill while the EST All-Mtn Rocker provides versatile performance on the
      journey down.</td>
  </tr>

另一个解决方案是使用colspan避免添加空单元格:

table,
tr,
td,
th {
  border: 1px solid;
  border-collapse: collapse;
}
.noBorder {
  border: 0;
}
<table>
  <tr class="noBorder">
    <th colspan=5>Men</th>
  </tr>
  <tr>
    <th>Brand</th>
    <th>Model</th>
    <th>Waist</th>
    <th>Lengths</th>
    <th>Quick Description </th>
  </tr>
  <tr class="noBorder">
    <th colspan=5>Armada</th>
  </tr>
  <tr>
    <td>Armada</td>
    <td>Tracer 88</td>
    <td>88</td>
    <td>162, 172</td>
    <td>Cut with an 88mm waist width and Armada s snow-shedding Tapertop topsheet to minimize added weight from snow buildup, the Armada Tracer 88 Skis travel swiftly and efficiently uphill while the EST All-Mtn Rocker provides versatile performance on the
      journey down.</td>
  </tr>

最新更新