CSS2 样式表(属性·表格)

最新推荐文章于 2022-10-21 09:00:35 发布

vinceding

最新推荐文章于 2022-10-21 09:00:35 发布

阅读量2.1k

点赞数

分类专栏： CSS 文章标签： css table 脚本算法浏览器 html

本文链接：https://blog.csdn.net/vince6799/article/details/1857117

版权

CSS 专栏收录该内容

28 篇文章 0 订阅

订阅专栏

1、border-collapse

语法：
border-collapse : separate | collapse
取值：
separate : 默认值。边框独立（标准HTML）
collapse : 相邻边被合并

说明：
设置或检索表格的行和单元格的边是合并在一起还是按照标准的HTML样式分开。
此属性对于 currentStyle 对象而言是只读的。对于其他对象而言是可读写的。
对应的脚本特性为 borderCollapse 。

示例：

table { border-collapse: separate; }

2、border-spacing

语法：
border-spacing : length
取值：
length : 由浮点数字和单位标识符组成的长度值。不可为负值。请参阅长度单位

说明：
设置或检索当表格边框独立(例如当 border-collapse 属性等于 separate 时)，行和单元格的边在横向和纵向上的间距。
当只指定一个 length 值时，这个值将作用于横向和纵向上的间距。
当指定了两个 length 值时，第一个作用于横向间距，第二个作用于纵向间距。
对应的脚本特性为borderSpacing

示例：

table { border-collapse: separate; border-spacing: 10px; }

3、caption-side

语法：
caption-side : top | right | bottom | left
取值：
top : 默认值。 caption 在表格的上边
right : caption 在表格的右边
bottom : caption 在表格的下边
left : caption 在表格的左边

说明：
设置或检索表格( table )的 caption 对象是在表格的那一边。它是和 caption 对象一起使用的属性。
对应的脚本特性为 captionSide 。

示例：

table caption { caption-side: top; width: auto; text-align: left; }

4、empty-cells

语法：
empty-cells : show | hide
取值：
show : 默认值。显示边框
hide : 隐藏边框

说明：
设置或检索当表格的单元格无内容时，是否显示该单元格的边框。
只有当表格行和列的边框独立（例如当 border-collapse 属性等于 separate ）时此属性才起作用。
对应的脚本特性为 emptyCells 。

示例：

table { caption-side: top; width: auto; border-collapse: separate; empty-cells: hide; }

5、table-layout

语法：
table-layout : auto | fixed
取值：
auto : 默认值。默认的自动算法。布局将基于各单元格的内容。表格在每一单元格内所有内容读取计算之后才会显示出来
fixed : 固定布局的算法。在这种算法中，表格和列的宽度取决于 col 对象的宽度总和，假如没有指定，则会取决于第一行每个单元格的宽度。假如表格没有指定宽度( width )属性，则表格被呈递的默认宽度为 100% 。

说明：
设置或检索表格的布局算法。
你可以通过此属性改善表格呈递性能。此属性导致IE以一次一行的方式呈递表格内容从而提供给信息用户更快的速度。此属性依据此下顺序使用其中一种方式布置表格栏宽度：

使用 col 或 colGroup 对象的宽度( width )属性信息。
使用表格第一行内的单元格的宽度( width )信息。
依据表格列数等分表格宽度。而不考虑表格内容的实际宽度。

假如单元格的内容超过了列宽度，内容将会被换行。假如无法换行，则内容会被裁切。假如此属性被设置为 fixed ，则 overflow 能够被用于控制处理溢出单元格( td )宽度的内容。假如表格行高度被指定了，那么换行的内容如果超出了指定表格行高度也会在纵向上被裁切。
设置此属性值为 fixed ，有助于提高表格性能。对于长表格效果尤其显著。
设置表格行高可以进一步提高呈递速度，浏览器不需要检测行内每一个单元格内容去确定行高就可以开始解析以及呈递。
此属性对于 currentStyle 对象而言是只读的。对于其他对象而言是可读写的。
对应的脚本特性为 tableLayout 。

示例：

table { table-layout: fixed; }

6、speak-header

语法：
speak-header : once | always
取值：
once : 默认值。表格标题在一系列单元格之前发声一次
always : 标题在每一个与之关联的单元格前发声

说明：
当表格( table )通过语音发生器说话时，数据单元格( td )和表格标题之间的关联必须被迅速确定。
一些语音浏览器允许用户在二维空间内移动。因而给他们机会映射空间区域关联。当这一点不可实现的时候，就需要通过样式表指定表格标题的发声点。
此属性设置或检索表格标题是在所有的单元格之前发声，还是到一个不与之关联的单元格就结束发声。
对应的脚本特性为 speakHeader 。

示例：

table { speak-header: once }