css - 删除没有边框折叠的单元格间距

Question

我只是偶然发现了这个问题，我想不出解决方案

我有一张桌子，我想让表格行有不同颜色的顶部和底部边框。

如果我只是执行以下操作

table tr { border-top:solid 1px #201e1f;border-bottom:solid 1px black; }

[..]

<table>
  <tr>
    <td>One</td>
    <td>Two</td>
  </tr>
  <tr>
    <td>One</td>
    <td>Two</td>
  </tr>
  <tr>
    <td>One</td>
    <td>Two</td>
  </tr>
</table>

我得到了所有单元格之间的间距（这是有道理的）但是当我添加以下 CSS 行时，底部边框覆盖了顶部边框，所以我只能看到一个边框

table { border-collapse:collapse; }

有谁知道我怎样才能在我的表格行上获得两个连接边框？

Answer 1

听起来您正在寻找border-spacing。

Answer 2

我没有测试，但试试这个：

cellspacing: 0

有关详细信息，请参阅http://www.w3schools.com/tags/att_table_cellspacing.asp。并且不要折叠你的边界。