阅读量:2
border-collapse属性用于控制表格的边框是否合并。
当border-collapse的值为collapse时,相邻单元格的边框会合并为一个单一的边框,表格看起来更加紧凑。而当border-collapse的值为separate时,相邻单元格的边框保持分开,表格看起来更加明显。
下面是一个使用border-collapse属性的简单示例:
HTML代码:
<table> <tr> <td>单元格1</td> <td>单元格2</td> </tr> <tr> <td>单元格3</td> <td>单元格4</td> </tr> </table>
CSS代码:
table { border-collapse: collapse; } td { border: 1px solid black; padding: 10px; }
在上面的示例中,我们将表格的border-collapse属性设置为collapse,使相邻单元格的边框合并为一个单一的边框。然后,我们为每个单元格设置了1像素的黑色边框和10像素的内边距。
运行示例后,我们将会看到表格的边框被合并为一个单一的边框,表格看起来更加紧凑。