介绍border-collapse

border-collapse是一个CSS样式属性，是用来定义表格的边框是否被合并的。这个属性只有在表格边框 border 设定为非 none 的情况下才有用，它的可选值有 collapse 和 separate。

用法

table {
  border-collapse: collapse;
}

这个例子将使得在一张表格中的相邻单元格之间没有空隙，它们的边框被合并成了一个表格的整体边框。

table {
  border-collapse: separate;
}

而这个例子则使得在一张表格中的相邻单元格之间仍有空隙，他们的边框不会被合并。

border-spacing

border-spacing是另一个和border-collapse相关的属性，它用于控制表格中的单元格之间的空隙大小。但也只有在 border-collapse 设定为 separate 的情况下才有用。其值可以为一个简单的 CSS 长度，例如：10px；也可以为两个 CSS 长度，分别用于代表水平间距和垂直间距，例如： 5px 10px。

注意事项

• 在表格中如果单元格的边框为 None，那么 border-collapse 并不会生效。
• 在 border-collapse 设定为 collapse 的情况下，不必为所有单元格都指定边框，只要有一个单元格指定了边框，整个表格的边框就会进行合并。