CSS border-collapse 属性

主题

定义和用法

border-collapse 属性设置表格的边框是否被合并为单一的边框，还是像在标准的 HTML 中那样分开显示。

border-collapse 属性只能应用于<table>元素或设置为display: table的元素中。

默认值：	separate
继承性：	支持
可动画性：	否。请参阅：可动画属性。
版本：	CSS2
JavaScript 语法：	object.style.borderCollapse="collapse"Demo ❯

下面通过边框合并和边框分开示例，让你更直观地了解 border-collapse 属性的用法：

实例代码运行代码

复制

/* 为表格设置分开边框模型 */
.table-separate {
    border-collapse:separate;
}

/* 为表格设置合并边框模型 */
.table-collapse {
    border-collapse:collapse;
}

border-collapse: separate|collapse|initial|inherit;

值	描述
`separate`	边框会被分开（默认值）。不会忽略border-spacing和empty-cells属性。
`collapse`	边框会合并为单一的边框。会忽略`border-spacing`和`empty-cells`属性。
`initial`	将此属性设置为其默认值。参阅 initial。
`inherit`	从其父元素继承此属性。参阅 inherit。