前端开发用到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样式
基础教程推荐
猜你喜欢
- 使用jquery+CSS3实现仿windows10开始菜单的下拉导航菜单特效 2024-01-22
- JavaScript常用语句循环,判断,字符串换数字 2023-08-08
- HTML5 video标签的poster属性图片铺满整个屏幕 2023-07-08
- CSS属性探秘系列(二):overflow及相关属性text-overflow 2024-03-12
- 详解从Vue-router到html5的pushState 2024-04-15
- Ajax结合php实现二级联动 2023-01-21
- css 如何清除浮动的示例代码 2023-12-21
- CSS实现footer“吸底”效果 2023-12-21
- Javascript继承机制的设计思想分享 2023-12-02
- Ajax解决缓存的5种方法总结(推荐) 2023-01-26