HTML 表格边框
❮ 上一篇 下一篇 ❯
HTML 表格可以具有不同样式和形状的边框。
如何添加边框
要添加边框,请在 table、th 和 td 元素上使用 CSS border 属性。
示例
table, th, td { border: 1px solid black;
}
自己动手试一试 »
合并表格边框
要避免出现上面示例中的双重边框,请将 CSS border-collapse 属性设置为 collapse。
这将使边框合并为单个边框。
示例
table, th, td { border: 1px solid black; border-collapse: collapse;}
自己动手试一试 »
样式化表格边框
如果为每个单元格设置背景色,并将边框设置为白色(与文档背景色相同),则会产生边框不可见的印象。
示例
table, th, td { border: 1px solid white; border-collapse: collapse;}th, td { background-color: #96D4D4;
}
自己动手试一试 »
圆角表格边框
使用 border-radius 属性,边框将获得圆角。
示例
table, th, td { border: 1px solid black; border-radius: 10px;}
自己动手试一试 »
通过从 CSS 选择器中省略 table 来跳过表格周围的边框。
示例
th, td { border: 1px solid black; border-radius: 10px;}
自己动手试一试 »
虚线表格边框
使用 border-style 属性,您可以设置边框的外观。
允许的值如下:
dotted
dashed
solid
double
groove
ridge
inset
outset
none
hidden
示例
th, td { border-style: dotted;}
自己动手试一试 »
边框颜色
使用 border-color 属性,您可以设置边框的颜色。
示例
th, td { border-color: #96D4D4;}
自己动手试一试 »
❮ 上一篇 下一篇 ❯
★ +1
W3schools 学习路径
跟踪您的进度 - 免费!
登录 注册