表格在行之间添加边距 - CSS

在CSS中，我们可以使用border-collapse和border-spacing属性，来控制表格的边框和间距。下面让我们来看一下具体的实现方法。

使用 border-collapse

border-collapse属性用于控制表格的边框是否合并为一个单一的边框，取值有separate和collapse。

当取值为separate时，表格边框不会合并，而是显示为各自独立的边框。

当取值为collapse时，表格边框会合并为一个单一的边框，这时我们可以使用border-spacing来设置表格行之间的间距。

下面是一个例子：

table {
  border-collapse: collapse;
  border-spacing: 10px;
}

通过上面的CSS代码，我们可以将表格的边框合并，并且行之间的间距为10px。

使用 border-spacing

border-spacing属性用于设置表格单元格之间的间距。该属性只有在表格的边框被合并为一个单一的边框时，才会生效。

下面是一个例子：

table {
  border-collapse: collapse;
  border-spacing: 10px;
}

通过上面的CSS代码，我们可以将表格的行之间的间距设置为10px。

总结

通过border-collapse和border-spacing属性，我们可以很方便地控制表格的边框和行之间的间距。在使用时，我们需要根据实际情况来选择使用哪个属性，以达到最好的效果。