属性 | 作用 |
bgcolor | 设置表格背景色 |
background | 设置表格背景图片 |
border | 设置边框宽度,默认为0 |
cellpadding | 设置单元格与内容之间的距离,默认值为2 |
cellspacing | 设置单元格之间的距离,默认值为2 |
bodercolor | 设置边框颜色 |
bodercolorlight | 置边框亮部分的颜色(boder大于等于1时有效) |
bodercolordark | 设置边框暗部分的颜色(boder大于等于1时才有效) |
align | 设置表格对齐格式(left、center、right) |
width | 设置表格宽度,单位用绝对像素和百分比 |
height | 设置表格高度,单位用绝对像素和百分比 |
属性 | 作用 |
width | 设置行宽度 |
height | 设置行高度 |
bgcolor | 设置行的背景颜色 |
align | 设置水平对齐方式(left/right/center) |
valign | 设置行垂直对齐方式(top、middle、bottom) |
属性 | 作用 |
width | 设置单元格宽度 |
height | 设置单元格高度 |
bgcolor | 设置单元格的背景颜色 |
background | background |
align | 设置水平对齐方式(left/right/center) |
valign | 设置行垂直对齐方式(top、middle、bottom) |
rowspan | 设置行合并数目 |
colspan | 设置列合并数目 |
nowarp | 设置在单元格中不换行 |
4.立体表格实现原理
表格的亮边框和暗边框颜色进行对比。
5.细线表格效果的实现原理
1.将表格的boder设为0.
2.给表格设置背景颜色为细线颜色
3.給表格设置单元格背景为白色
4.給表格设置单元格之间的距离为细线宽度
6.table的边框设置及其效果
属性名称 | 属性值 | 说明 |
frame(border>0) |
void | 不显现表格的边线 |
above | 只显现表格上边线 | |
below | 只显现表格下边线 | |
hsides | 只显现表格上下边线 | |
vsides | 只显现表格左右边线 | |
lhs | 只显现表格的左边线 | |
vhs | 只显现表格的右边线 | |
border/box | 显现表格的所有边线 | |
rules | rows | 只显示横行的格框线 |
cols | 只显示直行的格框线 | |
all | 显示所有的格框线 | |
groups | 表示列组合水平部分 | |
none | 不显示任何格框线 |
7.表格结构化格式
<table>
<thead>表头区</thead>
<tbody>表体区</tbody>
<tfoot>表尾区</tfoot>
</table>
8.直列化格式:<colgroup><colgroup>(<col>与<colgroup>的功能完全一样)
属性名称 |
属性值 |
说明 |
align |
left |
靠左 |
center |
靠中 |
|
right |
靠右 |
|
valign |
top |
靠上 |
middle |
靠中 |
|
bottom |
靠下 |
|
span |
数字 |
直列数 |
bgcolor |
颜色 |
背景颜色 |
例如:想把一个表格的第n列的颜色改变,可以这样做:
<colgroup span=”n-1”></colgroup>
<colgroup bgcolor=”你想的颜色”></colgroup>
9.表格的标题:
<table>
<caption>标题名</caption>
</table>
属性名称 |
属性值 |
说明 |
align |
top |
标题在表格上方 |
bottom |
标题在表格下方 |
|
left |
标题在表格左方 |
|
right |
标题在表格右方 |