一、表格的基本代碼:
表格由<TABLE><TR><TD>和</TD></TR></TABLE>這六標簽以及border這個屬性組合而成,可以通過在代碼中加入更多屬性來實現(xiàn)表格的各種不同樣式。
1、最簡單的表格:
代碼:
<TABLE border=1>
<TR><TD>表格內(nèi)容</TD></TR>
</TABLE>
效果:
表格內(nèi)容
說明:表格內(nèi)的“表格內(nèi)容”可以是文字、圖片、flash、鏈接網(wǎng)址等。
2 、多單元表格:
代碼:
<TABLE border=1>
<TR><TD>表格內(nèi)容</TD> <TD>表格內(nèi)容</TD><TD>表格內(nèi)容</TD></TR>
</TABLE>
效果:
表格內(nèi)容 表格內(nèi)容 表格內(nèi)容
3 、多行多列表格:
代碼:
<TABLE border=1>
<TR><TD>表格內(nèi)容</TD><TD>表格內(nèi)容</TD><TD>表格內(nèi)容</TD></TR>
<TR><TD>表格內(nèi)容</TD><TD>表格內(nèi)容</TD><TD>表格內(nèi)容</TD></TR>
</TABLE>
效果:
表格內(nèi)容 表格內(nèi)容 表格內(nèi)容
表格內(nèi)容 表格內(nèi)容 表格內(nèi)容
二、表格欄位合并的代碼:
表格欄位合并基本上分為行合并和列合并兩種。
1、左右欄位合并的表格:
代碼:
<TABLE border=1>
<TR><TD colspan=3>表格內(nèi)容</TD></TR>
<TR><TD>表格內(nèi)容</TD><TD>表格內(nèi)容</TD><TD>表格內(nèi)容</TD></TR>
</TABLE>
效果:
表格內(nèi)容
表格內(nèi)容
表格內(nèi)容
表格內(nèi)容
說明:首行的<TD>標簽中多了一個colspan命令,這是“左右欄位合并”的屬性,colspan=3的意思是“首行合并了3個單元格”,因此后面的的兩個<TD>都可以省掉,因為那兩格被合并了。
底行左右欄位合并的表格:
代碼:
<TABLE border=1>
<TR><TD>表格內(nèi)容</TD><TD>表格內(nèi)容</TD><TD>表格內(nèi)容</TD></TR>
<TR><TD>表格內(nèi)容</TD><TD>表格內(nèi)容</TD><TD>表格內(nèi)容</TD></TR>
<TR><TD colspan=3>表格內(nèi)容</TD></TR>
</TABLE>
效果:
表格內(nèi)容 表格內(nèi)容 表格內(nèi)容
表格內(nèi)容 表格內(nèi)容 表格內(nèi)容
表格內(nèi)容
說明:底行的<TD>標簽中多了一個colspan命令,這也是“左右欄位合并”的屬性,colspan=3的意思是“底行合并了3個單元格”,因此后面的的兩個<TD>都也可以省掉。
2、上下欄位合并的表格:
代碼:
<TABLE border=1>
<TR><TD rowspan=2>表格內(nèi)容</TD><TD>
表格內(nèi)容</TD><TD>表格內(nèi)容</TD></TR>
<TR><TD>表格內(nèi)容</TD><TD>表格內(nèi)容</TD></TR>
</TABLE>
效果:
表格內(nèi)容
表格內(nèi)容 表格內(nèi)容
表格內(nèi)容 表格內(nèi)容
說明:首列的<TD>標簽中則多了個rowspan命令,這是“上下欄位合并”的屬性,rowspan=2的意思是“首列合并了2個單元格”。