前端开发用到table表格是很常见的，那么table表格自带了哪些css样式呢？下面编程教程网小编给大家科普一下！
表格的CSS样式属性
| 属性 | 说明 |
|---|---|
| border-collapse | 规定是否合并表格边框 |
| border-spacing | 规定相邻单元格边框之间的距离 |
| caption-side | 规定表格标题的位置 |
| empty-cells | 规定是否显示表格中的空单元格上的边框和背景 |
| table-layout | 设置用于表格的布局算法 |
1、border-collapse属性
border-collapse 属性设置表格的边框是否被合并为一个单一的边框，还是像在标准的 HTML 中那样分开显示。
| 值 | 说明 |
|---|---|
| collapse | 如果可能，边框会合并为一个单一的边框。会忽略 border-spacing 和 empty-cells 属性 |
| separate | 默认值。边框会被分开。不会忽略 border-spacing 和 empty-cells 属性 |
| inherit | 规定应该从父元素继承 border-collapse 属性的值 |
2、border-spacing属性
| 值 | 说明 |
|---|---|
| length | 规定相邻单元的边框之间的距离。使用 px、cm 等单位。不允许使用负值。 如果定义一个length参数，那么定义的是水平和垂直间距。 如果定义两个length参数，那么第一个设置水平间距，而第二个设置垂直间距。 |
3、caption-side属性
| 值 | 说明 |
|---|---|
| top | 默认值。把表格标题定位在表格之上。 |
| bottom | 把表格标题定位在表格之下。 |
4、empty-cells 属性
| 值 | 说明 |
|---|---|
| hide | 不在空单元格周围绘制边框。 |
| show | 在空单元格周围绘制边框。默认。 |
5、table-layout属性
| 值 | 说明 |
|---|---|
| automatic | 默认。列宽度由单元格内容设定。 |
| fixed | 列宽由表格宽度和列宽度设定。 |
沃梦达教程
本文标题为：table表格自带了哪些css样式
猜你喜欢
- 用js读、写、删除Cookie代码分享及详细注释说明 2024-02-12
- vue中哪些数组方法不是响应式的 2023-10-08
- 微信小程序模板（template）使用详解 2024-01-17
- 一文详解e2e测试之cypress的使用 2023-12-25
- EasySlider 基于jQuery功能强大简单易用的滑动门插件 2024-02-20
- JavaScript中BOM和DOM详解 2023-12-22
- js中的循环方式及各种遍历的方法 2023-08-11
- 第一次vue项目打包历程 2023-10-08
- 改版了网上的一个js操作userdata 2023-11-30
- css水平居中的各种方法总结(推荐) 2024-01-06
