Html Table 样式

框线制作常用代码
代码	含义
<table>…</table>	建立表格，所有的其他标记都需要在此标记中

*<table width= heigth=></table>*	设定表格宽度width和高度height，属性值可以使用点数，如：width=50，也可以使用百分比，如：width=50%。
*<table bgcolor=></table>**	表格背景色。属性值可使用颜色英文名称如：bgcolor=Blue，也可以使用十六进制值如：bgcolor=#799ED2 。
*<table background=></table>**	表格的背景图。*=背景图片链接。如background=http://blog.hexun.com/images/rss2.png
*<table border=></table>**	表格框线的宽度。如：border=5
*<table bordercolor=></table>**	所有表格框线颜色，色值同上。
*<table bordercolordark=></table>**	表格框线暗面(即右边.下边)颜色。
*<table bordercolorlight=></table>**	表格框线亮面(即上边.左边)颜色。
*<table align=></table>**	表格水平对齐属性。属性值有left(左)center(中)right(右)三种。
*<table valign=></table>**	表格垂直对齐属性。属性值有top(顶部)bottom(底部)两种。
*<table cellspacing=></table>**	单元格间隙属性。
*<table cellpadding=></table>**	单元格数据间隙属性。
*<table rules=></table>**	表格内框线属性。rules=none(隐藏表格内所有框线)。rules=rows(显示所有行间的水平框线)rules=cols(显示所有列间的垂直框线)

<tbody>….</tbody>	body标记就是HTML文件的内容，内可含有所有文字、图片、表格和多媒体文件等组合。处于<table></table>内。

<tr>……</tr>	行。一组<tr></tr>为表格一行
<td>…..</td>	单元格。在<tr>与</tr>之间，一组<td></td>就是一小格。注：单元格也可以自设定高宽度，如：<td width=150 height=30></td>
*<td rowspan=></td>**	表格的行合并。*＝全部合并行数，如rowspan=5，指向下合并四行。
*<td colspan=></td>**	单元格合并。*＝全部合并格数，如colspan=5，指向右合并四格。
*<td width= height=* align=* valign=* bordercolor=* bgcolor=></td>*	<td>也可以像<table>那样使用多种属性代码定义单元格自有属性。

其它常用代码
*<img src=图片链接 width= height=></img>*	贴图代码。
<br>	换行代码。这个代码只有单个，没有</br>
<p>……</p>	分段代码。

示例
<table width=* height=* bgcolor=* border=* bordercolor=* cellspacing=* cellpadding=*> <body> <tr> <td> 此处加入内容 </td> </tr> </body> </table>	这就是一个带方框的代码贴子最基本的形式。如果在table和td里加上上边介绍的各种属性代码，或者增添tr和td的组数，就可以做出形式各异的贴子。

各种纯代码边框

<TABLE cellSpacing=0 borderColorDark=#4c8328 cellPadding=0 width=10 height=10 borderColorLight=#98d470 border=8> <TBODY> <TR> <TD> <TABLE cellSpacing=0 borderColorDark=#98d470 cellPadding=0 width=”100%” bgColor=#ffffff borderColorLight=#4c8328 border=6> <TBODY> <TR> <TD> <TABLE cellSpacing=0 cellPadding=0 width=”100%” border=0> <TBODY> <TR> <TD> <TABLE cellSpacing=0 borderColorDark=#4c8328 cellPadding=0 width=”100%” borderColorLight=#98d470 border=2> <TBODY> <TR> <TD> <TABLE cellSpacing=0 borderColorDark=#98d470 cellPadding=0 width=”100%” bgColor=#ffffff borderColorLight=#4c8328 border=3> <TBODY> <TR> <TD> <TABLE cellSpacing=5 cellPadding=0 width=500 height=600 border=0> <TBODY> <TR> <TD> 内容…… </TD></TR></TBODY></TABLE> </TD></TR></TBODY></TABLE> </TD></TR></TBODY></TABLE> </TD></TR></TBODY></TABLE> </TD></TR></TBODY></TABLE> </TD></TR></TBODY></TABLE>

<TABLE style=” BORDER-BOTTOM: #cc9900 4px dashed” cellSpacing=0 cellPadding=10 align=center height=600> <TBODY> <TR> <TD> 内容…… </TD></TR></TBODY></TABLE>

<TABLE style=”BORDER-RIGHT: Blue 5px dashed; BORDER-BOTTOM: Blue 5px dashed” cellSpacing=0 cellPadding=0 align=center> <TBODY> <TR> <TD> <TABLE borderColor=Blue height=600 cellSpacing=2 cellPadding=40 width=500 align=center bgColor=Blue border=3> <TBODY> <TR> <TD background=背景图链接> <TABLE border=0> <TBODY> <TR> <TD> 内容…… </TD></TR></TBODY></TABLE> </TD></TR></TBODY></TABLE> </TD></TR></TBODY></TABLE>

<TABLE style=”BORDER-TOP-STYLE: dashed; BORDER-BOTTOM-STYLE: dashed” borderColor=#2907b5 cellSpacing=0 cellPadding=5 width=650 align=center border=10> <TBODY> <TR> <TD> 内容…….. </TD> </TR> </TBODY> </TABLE>

<TABLE style=”BORDER-RIGHT: #000000 5px dotted; ” cellSpacing=3 cellPadding=5 width=500 height=500 align=center border=5> <TBODY> <TR> <TD> <TABLE cellSpacing=0 cellPadding=0 width=”75%” border=0> <TBODY> <TR> <TD> 内容…… </TD> </TR> </TBODY> </TABLE> </TD> </TR> </TBODY> </TABLE>

<TABLE cellSpacing=0 cellPadding=0 width=100% border=0> <TBODY> <TR> <TD> <center> <TABLE cellSpacing=0 cellPadding=0 width=100% border=0> <TBODY> <TR> <TD vAlign=top width=100% height=20> <TABLE style=”WORD-BREAK: break-all; BORDER-COLLAPSE: collapse” cellSpacing=0 cellPadding=0 width=10% border=0> <TBODY> <TR> <TD width=26></TD> <TD style=”LINE-HEIGHT: 18px” width=100%> <TABLE cellSpacing=0 cellPadding=15 width=”100%” border=0> <TBODY> <TR> <TD vAlign=top width=”100%” bgColor=#ffffff> <TABLE cellSpacing=0 cellPadding=0 width=”100%” border=0> <TBODY> <TR> <TD vAlign=top> <center> <TABLE style=”BORDER-RIGHT: #000000 4px dotted; BORDER-BOTTOM: #000000 4px dotted” cellSpacing=0> <TBODY> <TR> <TD> <TABLE style=”BORDER-RIGHT: #000000 2px dotted; BORDER-BOTTOM: #000000 2px dotted” cellSpacing=0> <TBODY> <TR> <TD> <TABLE borderColor=#000000 cellSpacing=0 cellPadding=0 width=100% border=5> <TBODY> <TR> <TD> <center> <TABLE cellSpacing=0 cellPadding=5 width=500 height=600 border=0> <TBODY> <TR> <TD> 内容…… </TD></TR></TBODY></TABLE> </center> </TD></TR></TBODY></TABLE> </TD></TR></TBODY></TABLE> </TD></TR></TBODY></TABLE> </center> </TD></TR></TBODY></TABLE> </TD></TR></TBODY></TABLE> </TD></TR></TBODY></TABLE> </TD></TR></TBODY></TABLE> </center> </TD></TR></TBODY></TABLE>

<table style=”BORDER-TOP-STYLE: dashed; BORDER-BOTTOM-STYLE: dashed” borderColor=#666666 cellSpacing=0 cellPadding=0 align=center border=2> <tbody> <tr> <td> <table style=”BORDER-TOP-STYLE: dotted; BORDER-BOTTOM-STYLE: dotted” borderColor=#666666 cellSpacing=0 cellPadding=2 border=2> <tbody> <tr> <td> <table style=”BORDER-RIGHT: #666666 1px dotted; BORDER-BOTTOM: #666666 1px dotted” borderColor=#666666 cellSpacing=2 cellPadding=4 width=500 height=600 align=center border=1> <tbody> <tr> <td> 内容…… </td> </tr> </tbody> </table> </td> </tr> </tbody> </table> </td> </tr> </tbody> </table>

<table style=”BORDER-TOP-STYLE: dashed; BORDER-BOTTOM-STYLE: dashed” borderColor=#000000 cellSpacing=0 cellPadding=0 border=3> <tbody> <tr> <td> <table style=”BORDER-TOP-STYLE: dotted; BORDER-BOTTOM-STYLE: dotted” borderColor=#000000 cellSpacing=0 cellPadding=0 border=3> <tbody> <tr> <td> <table style=”BORDER-TOP-STYLE: dashed; BORDER-BOTTOM-STYLE: dashed” borderColor=#000000 cellSpacing=0 cellPadding=0 border=4> <tbody> <tr> <td> <table style=”BORDER-TOP-STYLE: dotted; BORDER-BOTTOM-STYLE: dotted” borderColor=#000000 cellSpacing=0 cellPadding=0 border=3> <tbody> <tr> <td> <table style=”BORDER-RIGHT: #000000 0px ridge; BACKGROUND-COLOR: #000000″ cellSpacing=3> <tbody> <tr> <td> <table style=”BORDER-TOP-STYLE: dashed; BORDER-BOTTOM-STYLE: dashed” borderColor=#ffffff cellSpacing=0 cellPadding=0 border=2> <tbody> <tr> <td> <table style=”WIDTH: 500px; BORDER-BOTTOM-STYLE: dotted” borderColor=#ffffff height=0 cellSpacing=0 cellPadding=10 border=3> <tbody> <tbody> <tr> <TD style=”COLOR: #ffffff”> 内容…… </TD> </tr> </tbody> </table> </td> </tr> </tbody> </table> </td> </tr> </tbody> </table> </td> </tr> </tbody> </table> </td> </tr> </tbody> </table> </td> </tr> </tbody> </table> </td> </tr> </tbody> </table>

******************************
<TABLE style=”BORDER-RIGHT: #4d2d7d 3px dotted; BORDER-BOTTOM: #4d2d7d 3px dotted” cellSpacing=0 cellPadding=0 align=center> <TBODY> <TR> <TD> <TABLE style=”BORDER-RIGHT: #7d69c9 6px dotted; BORDER-BOTTOM: #7d69c9 6px dotted” cellSpacing=0 cellPadding=0 width=10> <TBODY> <TR> <TD> <TABLE style=”BORDER-RIGHT: #4d2d7d 8px dotted; BORDER-BOTTOM: #4d2d7d 8px dotted” cellSpacing=0 cellPadding=0 width=10> <TBODY> <TR> <TD style=”BORDER-RIGHT: #7b7bc0 1px dotted; BORDER-BOTTOM: #7b7bc0 1px dotted” borderColor=#7b7bc0 width=10 bgColor=#7b7bc0 height=10 border=”0″ cellpadding=”0″ cellspacing=”0″> <TABLE height=600 cellSpacing=0 cellPadding=20 width=500 background=背景图链接 border=0> <TBODY> <TR> <TD> 内容…… </TD></TR></TBODY></TABLE> </TD></TR></TBODY></TABLE> </TD></TR></TBODY></TABLE> </TD></TR></TBODY></TABLE>

<TABLE style=”BORDER-RIGHT: #3faf6c 6px dotted; BORDER-BOTTOM: #3faf6c 6px dotted” cellSpacing=0 cellPadding=0 align=center> <TBODY> <TR> <TD> <TABLE style=”BORDER-RIGHT: #439b43 6px dotted; BORDER-BOTTOM: #439b43 6px dotted” cellSpacing=0 cellPadding=0 width=10> <TBODY> <TR> <TD> <TABLE style=”BORDER-RIGHT: #94d1b9 5px dotted; BORDER-BOTTOM: #94d1b9 5px dotted” cellSpacing=0 cellPadding=0 width=10> <TBODY> <TR> <TD style=”BORDER-RIGHT: #3f6c3f 2px dotted; BORDER-BOTTOM: #3f6c3f 2px dotted” borderColor=#3f6c3f width=10 bgColor=#3f6c3f height=10 border=”0″ cellpadding=”0″ cellspacing=”0″> <TABLE height=600 cellSpacing=0 cellPadding=20 width=500 background=背景图链接 border=0> <TBODY> <TR> <TD> 内容…… </TD></TR></TBODY></TABLE> </TD></TR></TBODY></TABLE> </TD></TR></TBODY></TABLE> </TD></TR></TBODY></TABLE>

<TABLE cellPadding=3 width=”480″ bgColor=#000000 border=0> <TBODY> <TR> <TD> <TABLE height=660 cellSpacing=0 cellPadding=10 width=480 border=5 bortercolor=”#000000″> <TBODY> <TR> <TD style=”COLOR: #99ccff”>内容……. </TD> </TR> </TBODY> </TABLE> </TD> </TR> </TBODY> </TABLE>

<TABLE cellPadding=5 height=600 width=500 align=center border=5> <TBODY> <TR> <TD> 内容…… </TD> </TR> </TBODY> </TABLE>

<TABLE width=500 height=600 borderColor=#aaaaaa cellSpacing=25 cellPadding=5 align=center bgColor=#eeeeee border=10> <TBODY> <TR> <TD> 内容…… </TD> </TR> </TBODY> </TABLE>

<TABLE borderColor=#ebd0be cellSpacing=2 cellPadding=3 width=180 height=120 bgColor=#000000 border=5> <TBODY> <TR> <TD style=”COLOR: #ffffff”>内容…… </TD> </TR> </TBODY> </TABLE>

<TABLE cellSpacing=0 width=10> <TBODY> <TR> <TD> <TABLE cellSpacing=0> <TBODY> <TR> <TD> <TABLE cellSpacing=0> <TBODY> <TR> <TD> <TABLE borderColor=#663300 cellSpacing=1 borderColorDark=#663300 cellPadding=1 width=10 align=center border=4> <TBODY> <TR> <TD> <TABLE cellSpacing=3 cellPadding=5 borderColor=white height=600 width=500 border=3> <TBODY> <TR> <TD> 内容…… </TD></TR></TBODY></TABLE> </TD></TR></TBODY></TABLE> </TD></TR></TBODY></TABLE> </TD></TR></TBODY></TABLE> </TD></TR></TBODY></TABLE>

<TABLE style=”BORDER-RIGHT: 8px groove; BORDER-BOTTOM: 8px groove” height=500 cellSpacing=5 borderColorDark=#808080 cellPadding=2 width=500 align=center borderColorLight=#c0c0c0 border=7> <TBODY> <TR> <TD> 内容…… </TD> </TR> </TBODY> </TABLE>

<table style=”BORDER-RIGHT: #a6b9f2 8px ridge; BACKGROUND-COLOR: #e6e7f6″ cellSpacing=15 cellPadding=5 align=center border=10> <tbody> <tr> <td> 内容…… </td> </tr> </tbody> </table>