如何在表格单元格之间设置垂直线？

Question

在下面的代码中，我想在单元格之间设置垂直线，最好的方法是什么？我试过的东西是给表格提供背景颜色，但它与给表格单元格提供边框相同，然后尝试了左边框或右边框，但它会在单元格外多出一行。这里我想要单元格之间的垂直线。请帮忙。

table tr td {
  background-color: #dedede;
  color: black
}

<table>
  <tr>
    <td>this is first cell</td>
    <td>this is second cell</td>
    <td>this is third cell</td>
  </tr>
  <tr>
    <td>this is fouth cell</td>
    <td>this is fifth cell</td>
    <td>this is sixth cell</td>
  </tr>
</table>

Answer 1

像这样？这会为table tr td行中除最后一个之外的每一个添加一个边框

table tr td {
  border-right: 1px solid blue;
  color: black
}

table tr td:last-of-type {
  border: none;
}

<table>
  <tr>
    <td>this is the first cell</td>
    <td>this is the second cell</td>
    <td>this is the third cell</td>
  </tr>
  <tr>
    <td>this is the fourth cell</td>
    <td>this is the fifth cell</td>
    <td>this is the sixth cell</td>
  </tr>
</table>

正如 Daniel A. White 所提到的 -last-child也有效：

table tr td:last-child {
  border: none;
}