在HTML网页中经常会用到表格,在HTML中表格的边框默认是分开显示的,我们该如何设置合并边框呢?下面我们来看一下css设置合并边框的方法。
在HTML中表格默认是分开显示的:
css可以使用border-collapse属性合并边框,border-collapse属性设置表格的边框是否被合并为一个单一的边框,还是象在标准的HTML中那样分开显示。
示例:
table
{
border-collapse:collapse;
}
table, td, th
{
border:1px solid black;
}
Firstname | Lastname |
---|---|
Bill | Gates |
Steven | Jobs |
注释:如果没有规定 !DOCTYPE,border-collapse 属性可能会引起意想不到的错误。
效果如下:
border-collapse的属性值:separate默认值。边框会被分开。不会忽略 border-spacing 和 empty-cells 属性。
collapse如果可能,边框会合并为一个单一的边框。会忽略 border-spacing 和 empty-cells 属性。
inherit规定应该从父元素继承 border-collapse 属性的值。