|
表格边框代码应用（1）
一、表格的基本代码：
表格由<TABLE><TR><TD>和</TD></TR></TABLE>这六标签以及border这个属性组合而成，可以通过在代码中加入更多属性来实现表格的各种不同样式。
1、最简单的表格：
代码：
<TABLE border=1>
<TR><TD>表格内容</TD></TR>
</TABLE>
效果：
说明：表格内的“表格内容”可以是文字、图片、flash、链接网址等。
2 、多单元表格：
代码：
<TABLE border=1>
<TR><TD>表格内容</TD> <TD>表格内容</TD><TD>表格内容</TD></TR>
</TABLE>
效果：
3 、多行多列表格：
代码：
<TABLE border=1>
<TR><TD>表格内容</TD><TD>表格内容</TD><TD>表格内容</TD></TR>
<TR><TD>表格内容</TD><TD>表格内容</TD><TD>表格内容</TD></TR>
</TABLE>
效果：
| 表格内容 |
表格内容 |
表格内容 |
| 表格内容 |
表格内容 |
表格内容 |
二、表格栏位合并的代码：
表格栏位合并基本上分为行合并和列合并两种。
1、左右栏位合并的表格：
代码：
<TABLE border=1>
<TR><TD colspan=3>表格内容</TD></TR>
<TR><TD>表格内容</TD><TD>表格内容</TD><TD>表格内容</TD></TR>
</TABLE>
效果：
说明：首行的<TD>标签中多了一个colspan命令，这是“左右栏位合并”的属性，colspan=3的意思是“首行合并了3个单元格”，因此后面的的两个<TD>都可以省掉，因为那两格被合并了。
底行左右栏位合并的表格：
代码：
<TABLE border=1>
<TR><TD>表格内容</TD><TD>表格内容</TD><TD>表格内容</TD></TR>
<TR><TD>表格内容</TD><TD>表格内容</TD><TD>表格内容</TD></TR>
<TR><TD colspan=3>表格内容</TD></TR>
</TABLE>
效果：
| 表格内容 |
表格内容 |
表格内容 |
| 表格内容 |
表格内容 |
表格内容 |
|
表格内容 |
说明：底行的<TD>标签中多了一个colspan命令，这也是“左右栏位合并”的属性，colspan=3的意思是“底行合并了3个单元格”，因此后面的的两个<TD>都也可以省掉。
2、上下栏位合并的表格：
代码：
<TABLE border=1>
<TR><TD rowspan=2>表格内容</TD><TD>
表格内容</TD><TD>表格内容</TD></TR>
<TR><TD>表格内容</TD><TD>表格内容</TD></TR>
</TABLE>
效果：
说明：首列的<TD>标签中则多了个rowspan命令，这是“上下栏位合并”的属性，rowspan=2的意思是“首列合并了2个单元格”。
| 
