我正在开发 HTML 格式的报告。我那里有一张桌子。在每个 TD 中我都有另一个表。我想将 td 中的每个表分开。所以我启用了主表的边框。但内部表格很少需要显示单元格边框。但我不希望显示该特定内部表格的外边框。
Ex.
<table ID="main" >
<tr>
<td>
<table ID="INTER1">
<tr>
<td>Table1 without internal border</td>
<tr>
</table>
</td>
<td>
<table ID="INTER2">
<tr>
<td>Table with internal border</td>
<tr>
</table>
</td>
</tr>
<table>
我想使用 CSS 类来做到这一点。我已经用谷歌搜索了它,但我找到了适用于所有标签的解决方案,但这意味着它将删除所有表格的外边框。
我可以有上述问题的解决方案吗?
这是你可以做到的,你只需要添加n-bordered
class
到每个不需要外边框的表格。
.border-none {
border-collapse: collapse;
border: none;
}
.border-none td {
border: 1px solid black;
}
.border-none tr:first-child td {
border-top: none;
}
.border-none tr:last-child td {
border-bottom: none;
}
.border-none tr td:first-child {
border-left: none;
}
.border-none tr td:last-child {
border-right: none;
}
<table class="border-none">
<tr>
<td>Cell 1</td>
<td>Cell 2</td>
<td>Cell 3</td>
</tr>
<tr>
<td>Cell 4</td>
<td>Cell 5</td>
<td>Cell 6</td>
</tr>
<tr>
<td>Cell 7</td>
<td>Cell 8</td>
<td>Cell 9</td>
</tr>
<tr>
<td>Cell 10</td>
<td>Cell 11</td>
<td>Cell 12</td>
</tr>
</table>
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)