html - 只有垂直线可见的表格

Question

我需要一种在表格中只显示垂直线的方法。

我尝试将左边框和右边框添加到表格和单独的 td，两者都使用 :1px solid #red;。但它不会添加边框颜色。

所以我正在寻找一种创建这些垂直线的简单方法。

Answer 1

在你的 <table> 上使用 border-collapse比你的 <td> 上的 border-left 和 border-right .

table { border-collapse: collapse; }
tr { border: none; }
td {
  border-right: solid 1px #f00; 
  border-left: solid 1px #f00;
}

<table>
  <tr>
    <td>a</td>
    <td>b</td>
  </tr>
  <tr>
    <td>c</td>
    <td>d</td>
  </tr>
</table>