css border-spacing 样式

时间:2023-04-26 21:08:51

border-spacing 属性用于控制相邻单元格之间的间距,只适用于 border-collapse 属性值为 separate 的表格。该属性允许您指定水平和垂直间距的大小。如果 border-collapse 的值为 collapse,则 border-spacing 不会产生任何效果。

以下是 border-spacing 的语法:

border-spacing: horizontal-spacing vertical-spacing;

horizontal-spacing:相邻单元格的水平间距,可以是长度单位(如像素、百分比等)或者是关键字 inherit。
vertical-spacing:相邻单元格的垂直间距,可以是长度单位或者是关键字 inherit。
下面是一个示例,将 border-spacing 设置为 10px:

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

在这个示例中,相邻单元格之间的水平和垂直间距均为 10px,从而增加了表格的可读性和美观性。

需要注意的是,border-spacing 只适用于表格元素(如 <table>、<th>、<td> 等)。如果应用于其他元素,则该属性将被忽略。

相关词 border