WEB标准学习路程之"CSS":7.表格,滚动条,打印
表格属性
Table Properties |
CSS Version |
Compatibility |
Inherit From Parent |
Description |
|||||||
CSS2 |
IE5+ |
有 |
设置或检索表格的行和单元格的边是合并在一起还是按照标准的HTML样式分开 |
||||||||
CSS2 |
NONE |
有 |
设置或检索当表格边框独立时,行和单元格的边框在横向和纵向上的间距 |
||||||||
CSS2 |
NONE |
有 |
设置或检索表格的caption对象是在表格的那一边 |
||||||||
CSS2 |
NONE |
有 |
设置或检索当表格的单元格无内容时,是否显示该单元格的边框 |
||||||||
CSS2 |
IE5+ |
有 |
设置或检索表格的布局算法 |
||||||||
CSS2 |
NONE |
有 |
设置或检索表格头与其后的一系列单元格发生多少次关系 |
border-collapse
语法: border-collapse : separate | collapse
参数:
separate : 边框独立(标准HTML)
rtl : 相邻边被合并
说明:
设置或检索表格的行和单元格的边是合并在一起还是按照标准的HTML样式分开。
对应的脚本特性为borderCollapse。请参阅我编写的其他书目。
示例: table { border-collapse: separate; }
border-spacing
语法: border-spacing : length || length
参数: length : 由浮点数字和单位标识符组成的长度值。不可为负值。请参阅长度单位
说明:
设置或检索当表格边框独立(例如当border-collapse属性等于separate时),行和单元格的边框在横向和纵向上的间距。
当只指定一个length值时,这个值将作用于横向和纵向上的间距。当指定了全部两个length值时,第一个作用于横向间距,第二个作用于纵向间距。
目前IE5.5尚不支持此属性。
对应的脚本特性为borderSpacing。请参阅我编写的其他书目。
示例: table { border-collapse: separate; border-spacing: 10px; }
caption-side
语法: caption-side : bottom | left |right | top
参数:
bottom : 下面 left : 左边 right : 右边 top : 下面
说明:
设置或检索表格的caption对象是在表格的那一边。它是和caption对象一起使用的属性。
目前IE5.5尚不支持此属性。
对应的脚本特性为captionSide。请参阅我编写的其他书目。
示例: table caption { caption-side: top; width: auto; text-align: left; }
empty-cells
语法: empty-cells : hide | show
参数: hide : 隐藏 show : 显示
说明:
设置或检索当表格的单元格无内容时,是否显示该单元格的边框。
只有当表格边框独立(例如当border-collapse属性等于separate时)此属性才起作用。
目前IE5.5尚不支持此属性。
对应的脚本特性为emptyCells。请参阅我编写的其他书目。
示例: table { caption-side: top; width: auto; border-collapse: separate; empty-cells: hide; }
table-layout
语法: table-layout : auto | fixed
参数:
auto : 默认的自动算法。布局将基于各单元格的内容。表格在每一单元格读取计算之后才会显示出来。速度很慢
fixed : 固定布局的算法。在这算法中,水平布局是仅仅基于表格的宽度,表格边框的宽度,单元格间距,列的宽度,而和表格内容无关
说明:
设置或检索表格的布局算法。
对应的脚本特性为tableLayout。请参阅我编写的其他书目。
示例: table { table-layout: auto; }
speak-header
语法: speak-header : once | always
参数:
once : 所有的单元格只有一个表格头
fixed : 每一组单元格对应一个表头
说明:
设置或检索表格头与其后的一系列单元格发生多少次关系。
目前IE5.5尚不支持此属性。
对应的脚本特性为speakHeader。请参阅我编写的其他书目。
示例: table { speak-header: once }
滚动条属性
Scrollbar Properties |
CSS Version |
Compatibility |
Inherit From Parent |
Description |
||||||
IE专有属性 |
IE5.5+ |
有 |
设置或检索滚动条亮边框颜色 |
|||||||
IE专有属性 |
IE5.5+ |
有 |
设置或检索滚动条3D界面的亮边(ThreedHighlight)颜色 |
|||||||
IE专有属性 |
IE5.5+ |
有 |
设置或检索滚动条3D表面(ThreedFace)的颜色 |
|||||||
IE专有属性 |
IE5.5+ |
有 |
设置或检索滚动条方向箭头的颜色 |
|||||||
IE专有属性 |
IE5.5+ |
有 |
设置或检索滚动条3D界面的暗边(ThreedShadow)颜色 |
|||||||
IE专有属性 |
IE5.5+ |
有 |
设置或检索滚动条暗边框(ThreedDarkShadow)颜色 |
|||||||
IE专有属性 |
IE5.5+ |
有 |
设置或检索滚动条基准颜色。其它界面颜色将据此自动调整 |
scrollbar-3d-light-color
语法: scrollbar-3d-light-color : color
参数: color : 指定颜色。请参阅颜色单位和附录:颜色表
说明:
设置或检索滚动条亮边框颜色。
请参阅overflow属性。
对应的脚本特性为scrollbar3dLightColor。请参阅我编写的其他书目。
示例: div {scrollbar-3d-light-color :threedhighlight; }
scrollbar-highlight-color
语法: scrollbar-highlight-color : color
参数: color : 指定颜色。请参阅颜色单位和附录:颜色表
说明:
设置或检索滚动条3D界面的亮边(ThreedHighlight)颜色。
请参阅overflow属性。
对应的脚本特性为scrollbarHighlightColor。请参阅我编写的其他书目。
示例: div {scrollbar-highlight-color :threedhighlight; }
scrollbar-face-color
语法: scrollbar-face-color : color
参数: color : 指定颜色。请参阅颜色单位和附录:颜色表
说明:
设置或检索滚动条3D表面(ThreedFace)的颜色。
请参阅overflow属性。
对应的脚本特性为scrollbarFaceColor。请参阅我编写的其他书目。
示例: div {scrollbar-face-color : threedface; }
scrollbar-arrow-color
语法: scrollbar-arrow-color : color
参数: color : 指定颜色。请参阅颜色单位和附录:颜色表
说明:
设置或检索滚动条方向箭头的颜色。当滚动条出现但不可用时,此属性失效。
请参阅overflow属性。
对应的脚本特性为scrollbarArrowColor。请参阅我编写的其他书目。
示例: div {scrollbar-arrow-color : buttontext; }
scrollbar-shadow-color
语法: scrollbar-shadow-color : color
参数: color : 指定颜色。请参阅颜色单位和附录:颜色表
说明:
设置或检索滚动条3D界面的暗边(ThreedShadow)颜色。
请参阅overflow属性。
对应的脚本特性为scrollbarShadowColor。请参阅我编写的其他书目。
示例: div {scrollbar-shadow-color :ThreedDarkShadow; }
scrollbar-dark-shadow-color
语法: scrollbar-dark-shadow-color : color
参数: color : 指定颜色。请参阅颜色单位和附录:颜色表
说明:
设置或检索滚动条暗边框(ThreedDarkShadow)颜色。
请参阅overflow属性。
对应的脚本特性为scrollbarDarkShadowColor。请参阅我编写的其他书目。
示例: div {scrollbar-dark-shadow-color :threeddarkshadow; }
scrollbar-base-color
语法: scrollbar-base-color : color
参数: color : 指定颜色。请参阅颜色单位和附录:颜色表
说明:
设置或检索滚动条基准颜色。其它界面颜色将据此自动调整。
请参阅overflow属性。
对应的脚本特性为scrollbarBaseColor。请参阅我编写的其他书目。
示例: div {scrollbar-base-color : buttonface; }
打印属性
Printing Properties |
CSS Version |
Compatibility |
Inherit From Parent |
Description |
||||||
CSS2 |
IE5.5+ |
有 |
检索或指定显示对象容器时使用的页面类型(pagetype)。参阅@page规则 |
|||||||
CSS2 |
IE4+ |
无 |
检索或设置对象后出现的页分割符 |
|||||||
CSS2 |
IE4+ |
无 |
检索或设置对象前出现的页分割符 |
|||||||
CSS2 |
NONE |
有 |
检索或设置对象容器中出现的页分割符 |
|||||||
CSS2 |
NONE |
无 |
设置或检索什么样的标志是应该在页容器外边被给予 |
|||||||
CSS2 |
NONE |
有 |
设置或检索对象内容内一定要留在一页范围底端以内的行的最少数量 |
|||||||
CSS2 |
NONE |
有 |
检索或指定页面规格的调整 |
|||||||
CSS2 |
NONE |
有 |
检索或指定一定要留在页面顶部的行数 |
page
语法: page : auto | pagetype
参数:
auto : 参照当前的默认页面
pagetype : 指定@page规则里的一个页面类型(pagetype)定义
说明:
检索或指定显示对象容器时使用的页面类型(pagetype)。参阅@page规则。
对应的脚本特性为page。请参阅我编写的其他书目。
示例:
@page doublepage { size: 8.5in 11in; page-break-after: left }
body { page: doublepage; page-break-after: right }
page-break-after
语法: page-break-after : auto | always | avoid | left | right | null
参数:
auto : 假如需要在对象之后插入页分割符
always : 始终在对象之后插入页分割符
avoid : 避免在对象后面插入页分割符
left : 在对象后面插入页分割符直到它到达一个空白的左页边
right : 在对象后面插入页分割符直到它到达一个空白的右页边
null : 空值。IE5用来取消页分割符设置
说明:
检索或设置对象后出现的页分割符。
IE5仅支持always值和空白值(null)。
在IE4中此属性不作用于br对象,但是IE5作用。
对应的脚本特性为pageBreakAfter。请参阅我编写的其他书目。
示例: p { page-break-after: always;}
page-break-before
语法: page-break-before : auto | always | avoid | left | right | null
参数:
auto : 假如需要在对象之前插入页分割符
always : 始终在对象之前插入页分割符
avoid : 避免在对象前面插入页分割符
left : 在对象前面插入页分割符直到它到达一个空白的左页边
right : 在对象前面插入页分割符直到它到达一个空白的右页边
null : 空值。IE5用来取消页分割符设置
说明:
检索或设置对象前出现的页分割符。
IE5仅支持always值和空白值(null)。
在IE4中此属性不作用于br对象,但是IE5作用。
对应的脚本特性为pageBreakBefore。请参阅我编写的其他书目。
示例: p { page-break-after: always;}
page-break-inside
语法: page-break-inside : auto | avoid
参数:
auto : 假如需要在对象容器中插入页分割符
avoid : 使当前对象容器中禁止插入页分割符
说明:
检索或设置对象容器中出现的页分割符。
目前IE5.5尚不支持此属性。
对应的脚本特性为pageBreakInside。请参阅我编写的其他书目。
示例: p { page-break-inside: auto }
marks
语法: marks : none | crop || cross
参数:
none : 无页标记出现
crop : 在页面将会被裁切处指定切割标记
cross : 指定交叉线标记用来供页面对齐
说明:
印刷业的印刷文档通常在页面内容区域外带有一些标记,用来校正和调整所有的页面。此属性用来设置或检索什么样的标志是应该在页容器外边被给予。
目前IE5.5尚不支持此属性。
对应的脚本特性为marks。请参阅我编写的其他书目。
示例: body { marks: crop cross }
orphans
语法: orphans : number
参数: number : 整数
说明:
设置或检索对象内容内一定要留在一页范围底端以内的行的最少数量。
目前IE5.5尚不支持此属性。
对应的脚本特性为orphans。请参阅我编写的其他书目。
示例: p { orphans: 4; }
size
语法: size : auto | portrait | landscape | length
参数:
auto : 指定为适应目标纸张尺寸和方向的relative页面容器
portrait : 指定为适应目标纸张尺寸和方向的relative页面容器,不理会目标页的当前缺省的内容方向,使用文档流从左到右短距离跨越,向下长距离跨越的典型范例(纵向方式)
landscape : 指定为适应目标纸张尺寸和方向的relative页面容器,不理会目标页的当前缺省的内容方向,使用横向方式
length : 由浮点数字和单位标识符组成的长度值。指定为固定尺寸和方向的absolute页面容器。只有一个参数,则指定高度和宽度。用空格分开的两个,第一个指定高度,第二个指定宽度。请参阅长度单位
说明:
检索或指定页面规格的调整。它把页面容器归类为absolute和relative两种。absolute页面有固定的尺寸。relative页面容器将会调整适应目标纸张的尺寸。
目前IE5.5尚不支持此属性。
对应的脚本特性为size。请参阅我编写的其他书目。
示例: body { size: 8.5in 11in }
widows
语法: widows : number
参数: number : 无单位整数。不可为负值
说明:
检索或指定一定要留在页面顶部的行数。
目前IE5.5尚不支持此属性。
对应的脚本特性为widows。请参阅我编写的其他书目。
示例: p { widows: 1 }