Html 处理表内的底线

我试图处理一张桌子里面的底线（我想把它们切到右边一点）

这是我的表格代码：

<table class="reportTable">
     <thread>
          <tr>
                <th>firstColumn</th>
                <th>secondColumn</th>
                <th>thirdColumn</th>
          </tr>
     </thread>
     <tbody>
          <tr>
               <td>1</td>
               <td>2</td>
               <td>3</td> 
          </tr>
          <tr>
               <td>11</td>
               <td>22</td>
               <td>33</td> 
          </tr>
          <tr>
               <td>111</td>
               <td>222</td>
               <td>333</td> 
          </tr>
     </tbody>
</table>

---

我相信您想要的是CSS中的

边框间距

属性：

.reportTable {
    border-spacing: 10px 0;
}
.reportTable th, .reportTable td {
    border-bottom: 1px solid #E7E7E7;
    border-right: 1px solid #E7E7E7;
}

---

您可以将边框间距添加到表格中，并将其相对于负数左侧放置，以将其推回原始位置

编辑： 或者，您可以执行以下操作：

---

如果需要，可以添加一个宽度。

是您没有使用的吗？它似乎是为我。不，我想处理右边框，并在列之间添加更多的空格，当列的宽度设置为特定的数字时，它不工作，以更准确。。。如果您尝试添加更多的空格（更改右下角的像素数，它只会增加列的宽度，而不会使每两列之间的空格变大）。因此，是否要使线条变长或变短？我希望线条保持原样，只更改它们之间的线条（变大）很好，谢谢，但是行距的问题是它也会将第一列向右推，你知道如何避免吗？

.reportTable {
    border-spacing: 10px 0;
}
.reportTable th, .reportTable td {
    border-bottom: 1px solid #E7E7E7;
    border-right: 1px solid #E7E7E7;
}

<table class="reportTable">
 <thread>
      <tr>
            <th>firstColumn</th>
            <th>secondColumn</th>
            <th>thirdColumn</th>
      </tr>
 </thread>
 <tbody>
      <tr>
           <td>1</td>
           <td>2</td>
           <td>3</td> 
      </tr>
      <tr>
           <td>11</td>
           <td>22</td>
           <td>33</td> 
      </tr>
      <tr>
           <td>111</td>
           <td>222</td>
           <td>333</td> 
      </tr>
 </tbody>

.reportTable {
border-spacing: 30px 0;
}
.reportTable th, .reportTable td {
border-bottom: 1px solid #E7E7E7;
position: relative;
left: -30px;
}

.reportTable th,td {
border-bottom: 1px solid #E7E7E7;
}

table td + td, table th + th { 
position: relative;
left: 30px; 
}

table td + td + td, table th + th + th { 
position: relative;
left: 60px; 
}