如何去除表格边框上的空白

【问题标题】：How to remove white space on table border如何去除表格边框上的空白
【发布时间】：2022-06-15 18:33:23
【问题描述】：

我在表格的边框之间有一些空格。我不知道为什么，但边距不起作用。因为它是一张桌子，所以我在 td 和 th 上都有一个左边框。但我在侧边框和顶部/底部边框之间也有一个空间。

.table-bordered {
    border: 1px solid #9a9a9a !important;
}
.table-bordered > thead > tr > th,
    .table-bordered > tbody > tr > th,
    .table-bordered > tfoot > tr > th,
    .table-bordered > thead > tr > td,
    .table-bordered > tbody > tr > td,
    .table-bordered > tfoot > tr > td {
        border: 1px solid #9a9a9a !important;
        /* outline: none; */
    }
.table{
  border-collapse: collapse;
     border-spacing: 0;
}
.table-bordered > tbody > tr > td.border-bottom-white {
    border-bottom: 1px solid #fff !important;
}

<table class="table table-bordered" >
  <thead>
  <tr >
    <td>H1</td>
     <td>H2</td>
      <td>H3</td>
      <td>H1</td>
     <td>H2</td>
      <td>H3</td>
  </tr>
  </thead>
    <tr >
    <td colspan ="3" class="border-bottom-white" ></td>
    <td >2</td>
    <td >3</td>
  </tr>
  <tr >
    <td colspan ="3" class="border-bottom-white" ></td>
    <td >2</td>
    <td >3</td>
  </tr>
    <tr >
    <td  colspan ="3"  ></td>
    <td >2</td>
    <td >3</td>
  </tr>
</table>

【问题讨论】：

• 尝试使用开发工具检查元素。

标签： html css