隐藏表格,HTML的特定行的边框CSS

我试图摆脱此表上特定行中的边框。我想要男士和品牌Armada的行周围的边框,但没有中间botder行。出于某种原因,我无法使用tr类来摆脱它。我在做什么错误?隐藏表格,HTML的特定行的边框CSS

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>

以上是 隐藏表格,HTML的特定行的边框CSS 的全部内容, 来源链接: utcz.com/qa/258397.html

回到顶部