23款表格边框代码

**似水流雲**欢迎您 一、半透明表格边框效果   半透明表格边框代码   代码如下(透明值语法:opacity=30):   <TABLE style="FILTER: alpha(opacity=30)" height=200 width=200 bgColor=#ececec border=1> <TBODY> <TR> <TD>透明表格边框代码</TD></TR></TBODY></TABLE> 二、字集段表格边框效果:     公告   字集段表格边框代码   代码如下: <FIELDSET style="WIDTH: 300px"><LEGEND><FONT color=#99cc00>公告</FONT></LEGEND>字集段表格边框代码</FIELDSET>   三、正方体表格边框效果: 正方体表格边框代码   代码如下: <TABLE style="LEFT: 10px; TOP: 49px" height=26 borderColorDark=#222222 width=220 borderColorLight=#99cc00 border=1> <TBODY> <TR> <TD width="100%">正方体表格边框代码</TD></TR></TBODY></TABLE> 四、普通表格边框效果:   普通表格边框代码   代码如下:   <TABLE style="LEFT: 11px; TOP: 11px" height=26 width=220 border=1> <TBODY> <TR> <TD width="100%">普通表格边框代码</TD></TR></TBODY></TABLE> 五、立体按钮表格边框效果:     立体按钮表格边框代码   代码如下: <TABLE cellSpacing=0 cellPadding=0 width=200 align=center border=0> <TBODY> <TR> <TD bgColor=#666666> <TABLE style="BORDER-RIGHT: #333333 3px solid; ; BORDER-TOP: #999999 3px solid; BORDER-LEFT: #999999 3px solid; BORDER-BOTTOM: #333333 3px solid" borderColor=#7d7d7d cellSpacing=0 cellPadding=0 width="100%" border=1> <TBODY> <TR> <TD>立体按钮表格边框代码</TD></TR></TBODY></TABLE></TD></TR></TBODY></TABLE> 六、内发光的表格边框效果:     内发光的表格边框代码   代码如下: <TABLE style="BORDER-RIGHT: #888888 5px ridge; BORDER-TOP: #888888 5px ridge; BORDER-LEFT: #888888 5px ridge; BORDER-BOTTOM: #888888 5px ridge" borderColor=#cccccc height=200 cellSpacing=0 cellPadding=0 width=200 align=center border=1> <TBODY> <TR> <TD>内发光的表格边框代码</TD></TR></TBODY></TABLE> 七、实线表格边框效果:     实线表格边框代码       代码如下（语法：solid）: <TABLE style="BORDER-RIGHT: #99cc00 4px solid; BORDER-TOP: #99cc00 4px solid; BORDER-LEFT: #99cc00 4px solid; BORDER-BOTTOM: #99cc00 4px solid" borderColor=#99cc00 height=200 cellSpacing=0 cellPadding=0 width=200 align=center border=0> <TBODY> <TR> <TD>实线表格边框代码</TD></TR></TBODY></TABLE> 八、带阴影的表格边框效果   带阴影的表格边框代码   代码如下:(border=5中的值一定要大于1) <TABLE cellSpacing=0 borderColorDark=#444444 borderColorLight=#99cc00 border=5> <TBODY> <TR> <TD>带阴影的表格边框代码</TD></TR></TBODY></TABLE> 九、无样式的表格边框是看不到边框线的，即使边框值为5px也看不到，是一个隐藏的表格:   无样式的表格边框代码   代码如下(语法:none): <TABLE style="BORDER-RIGHT: #99cc00 5px none; BORDER-TOP: #99cc00 5px none; BORDER-LEFT: #99cc00 5px none; BORDER-BOTTOM: #99cc00 5px none" borderColor=#99cc00 height=200 cellSpacing=0 cellPadding=0 width=200 align=center border=0> <TBODY> <TR> <TD>无样式的表格边框代码</TD></TR></TBODY></TABLE> 十、外凸式表格边框效果:     外凸式表格边框代码     代码如下（语法：outset）: <TABLE style="BORDER-RIGHT: #99cc00 5px outset; BORDER-TOP: #99cc00 5px outset; BORDER-LEFT: #99cc00 5px outset; BORDER-BOTTOM: #99cc00 5px outset" borderColor=#99cc00 height=200 cellSpacing=0 cellPadding=0 width=200 align=center border=0> <TBODY> <TR> <TD>外凸式表格边框代码</TD></TR></TBODY></TABLE> 十一、内凹式表格边框效果:     内凹式表格边框代码       代码如下（语法：inset）: <TABLE style="BORDER-RIGHT: #99cc00 5px inset; BORDER-TOP: #99cc00 5px inset; BORDER-LEFT: #99cc00 5px inset; BORDER-BOTTOM: #99cc00 5px inset" borderColor=#99cc00 height=200 cellSpacing=0 cellPadding=0 width=200 align=center border=0> <TBODY> <TR> <TD>内凹式表格边框代码</TD></TR></TBODY></TABLE> 十二、脊线表格边框效果:     脊线表格边框代码       代码如下（语法：ridge）: <TABLE style="BORDER-RIGHT: #99cc00 5px ridge; BORDER-TOP: #99cc00 5px ridge; BORDER-LEFT: #99cc00 5px ridge; BORDER-BOTTOM: #99cc00 5px ridge" borderColor=#99cc00 height=200 cellSpacing=0 cellPadding=0 width=200 align=center border=0> <TBODY> <TR> <TD>脊线表格边框代码</TD></TR></TBODY></TABLE> 十三、立体光线表格边框效果:     立体光线表格边框代码       代码如下（语法：groove）: <TABLE style="BORDER-RIGHT: #99cc00 5px groove; BORDER-TOP: #99cc00 5px groove; BORDER-LEFT: #99cc00 5px groove; BORDER-BOTTOM: #99cc00 5px groove" borderColor=#99cc00 height=200 cellSpacing=0 cellPadding=0 width=200 align=center border=0> <TBODY> <TR> <TD>立体光线表格边框代码</TD></TR></TBODY></TABLE>  十四、双线表格边框效果:     双线表格边框代码       代码如下（语法：double）: <TABLE style="BORDER-RIGHT: #99cc00 5px double; BORDER-TOP: #99cc00 5px double; BORDER-LEFT: #99cc00 5px double; BORDER-BOTTOM: #99cc00 5px double" borderColor=#99cc00 height=200 cellSpacing=0 cellPadding=0 width=200 align=center border=0> <TBODY> <TR> <TD>双线表格边框代码</TD></TR></TBODY></TABLE>  十五、圆角型表格边框:   圆角型表格边框代码     代码如下: <TABLE cellSpacing=0 cellPadding=0 border=0> <TBODY> <TR> <TD colSpan=7 height=1></TD> <TD bgColor=#ff9ace height=1></TD> <TD colSpan=7 height=1></TD></TR> <TR> <TD colSpan=5></TD> <TD bgColor=#ff9ace></TD> <TD bgColor=#ff9ace></TD> <TD bgColor=#ffffff></TD> <TD bgColor=#ff9ace></TD> <TD bgColor=#ff9ace></TD> <TD colSpan=5></TD></TR> <TR> <TD colSpan=4></TD> <TD bgColor=#ff9ace></TD> <TD bgColor=#ffffff colSpan=5></TD> <TD bgColor=#ff9ace></TD> <TD colSpan=4></TD></TR> <TR> <TD colSpan=3></TD> <TD bgColor=#ff9ace></TD> <TD bgColor=#ffffff colSpan=7></TD> <TD bgColor=#ff9ace></TD> <TD colSpan=3></TD></TR> <TR> <TD colSpan=2></TD> <TD bgColor=#ff9ace></TD> <TD bgColor=#ffffff colSpan=9></TD> <TD bgColor=#ff9ace></TD> <TD colSpan=2></TD></TR> <TR> <TD></TD> <TD bgColor=#ff9ace></TD> <TD bgColor=#ffffff colSpan=11></TD> <TD bgColor=#ff9ace></TD> <TD></TD></TR> <TR> <TD></TD> <TD bgColor=#ff9ace></TD> <TD bgColor=#ffffff colSpan=11></TD> <TD bgColor=#ff9ace></TD> <TD></TD></TR> <TR> <TD bgColor=#ff9ace></TD> <TD bgColor=#ffffff></TD> <TD bgColor=#ffffff></TD> <TD bgColor=#ffffff></TD> <TD bgColor=#ffffff></TD> <TD bgColor=#ffffff></TD> <TD bgColor=#ffffff></TD> <TD style="FONT-SIZE: 8pt; COLOR: #888888" width=120 bgColor=#ffffff>圆角型表格边框代码</TD> <TD bgColor=#ffffff></TD> <TD bgColor=#ffffff></TD> <TD bgColor=#ffffff></TD> <TD bgColor=#ffffff></TD> <TD bgColor=#ffffff></TD> <TD bgColor=#ffffff></TD> <TD bgColor=#ff9ace></TD></TR> <TR> <TD></TD> <TD bgColor=#ff9ace></TD> <TD bgColor=#ffffff colSpan=11></TD> <TD bgColor=#ff9ace></TD> <TD></TD></TR> <TR> <TD></TD> <TD bgColor=#ff9ace></TD> <TD bgColor=#ffffff colSpan=11></TD> <TD bgColor=#ff9ace></TD> <TD></TD></TR> <TR> <TD colSpan=2></TD> <TD bgColor=#ff9ace></TD> <TD bgColor=#ffffff colSpan=9></TD> <TD bgColor=#ff9ace></TD> <TD colSpan=2></TD></TR> <TR> <TD colSpan=3></TD> <TD bgColor=#ff9ace></TD> <TD bgColor=#ffffff colSpan=7></TD> <TD bgColor=#ff9ace></TD> <TD colSpan=3></TD></TR> <TR> <TD colSpan=4></TD> <TD bgColor=#ff9ace></TD> <TD bgColor=#ffffff colSpan=5></TD> <TD bgColor=#ff9ace></TD> <TD colSpan=4></TD></TR> <TR> <TD colSpan=5></TD> <TD bgColor=#ff9ace></TD> <TD bgColor=#ff9ace></TD> <TD bgColor=#ffffff></TD> <TD bgColor=#ff9ace></TD> <TD bgColor=#ff9ace></TD> <TD colSpan=5></TD></TR> <TR> <TD colSpan=7 height=1></TD> <TD bgColor=#ff9ace height=1></TD> <TD colSpan=7 height=1></TD></TR></TBODY></TABLE>  十六、方形虚线表格边框效果:     方形虚线表格边框代码       代码如下（语法：dashed）: <TABLE style="BORDER-RIGHT: #99cc00 5px dashed; BORDER-TOP: #99cc00 5px dashed; BORDER-LEFT: #99cc00 5px dashed; BORDER-BOTTOM: #99cc00 5px dashed" borderColor=#dashed height=200 cellSpacing=0 cellPadding=0 width=200 align=center border=0> <TBODY> <TR> <TD>方形虚线表格边框代码</TD></TR></TBODY></TABLE>  十七、圆点虚线表格边框效果:     圆点虚线表格边框代码       代码如下（语法：dotted）: <TABLE style="BORDER-RIGHT: #99cc00 4px dotted; BORDER-TOP: #99cc00 4px dotted; BORDER-LEFT: #99cc00 4px dotted; BORDER-BOTTOM: #99cc00 4px dotted" borderColor=#99cc00 height=200 cellSpacing=0 cellPadding=0 width=200 align=center border=0> <TBODY> <TR> <TD>圆点虚线表格边框代码</TD></TR></TBODY></TABLE>  十八、模板表格边框效果     模板表格边框代码   代码如下 <TABLE style="BORDER-RIGHT: 5px solid; BORDER-TOP: 5px solid; BORDER-LEFT: 5px solid; WIDTH: 200px; BORDER-BOTTOM: 5px solid; HEIGHT: 200px" cellSpacing=0 cellPadding=5  border=5> <TBODY> <TR> <TD>模板表格边框代码</TD></TR></TBODY></TABLE>  十九、光晕效果表格边框     你见过这样的边框吗？     代码如下  <TABLE style="BORDER-RIGHT: #99cc00 3px solid; BORDER-TOP: #99cc00 3px solid; FILTER: glow; BORDER-LEFT: #99cc00 3px solid; WIDTH: 300px; BORDER-BOTTOM: #99cc00 3px solid; HEIGHT: 300px" cellSpacing=0 cellPadding=5 width=300 border=5> <TBODY> <TR> <TD> <P>你见过这样的边框吗？</P> </TD></TR></TBODY></TABLE>     二十、水晶透明效果边框一: 水晶透明效果边框一 内容(宽高自定义.调色要注意深浅)     水晶透明效果边框一代码如下: <TABLE style="BORDER-RIGHT: 1px solid; ; BORDER-TOP: 1px solid; BORDER-LEFT: 1px solid; BORDER-BOTTOM: 1px solid" borderColor=#19050f height=225 cellSpacing=0 cellPadding=0 width=225 align=center border=0> <TBODY> <TR> <TD style="FILTER: alpha(opacity=100,finishopacity=10,style=2)" bgColor=#ff359a height=5 align=middle>水晶透明效果边框一</TD></TR> <TR> <TD height=210>内容(宽高自定义.调色要注意深浅)</TD></TR></TBODY></TABLE>     水晶透明效果边框二:   水晶透明效果边框二 内容(宽高自定义调色要注意深浅) 1 2 3 4 5      水晶透明效果边框二代码如下: <TABLE style="BORDER-RIGHT: 1px solid; ; BORDER-TOP: 1px solid; BORDER-LEFT: 1px solid; BORDER-BOTTOM: 1px solid" borderColor=#19050f height=225 cellSpacing=0 cellPadding=0 width=225 align=center border=0> <TBODY> <TR> <TD style="FILTER: alpha(opacity=100,finishopacity=10,style=2)" bgColor=#ff359a height=5 align=middle>水晶透明效果边框二</TD></TR> <TR> <TD height=195>内容(宽高自定义调色要注意深浅)</TD></TR> <TR> <TD style="FILTER: alpha(opacity=100,finishopacity=10,style=2)" align=right bgColor=#ff359a height=15>1 2 3 4 5 </TD></TR></TBODY></TABLE> 二十一、另类水晶透明效果边框一: 另类水晶透明效果边框一 内容(宽高自定义.调色要注意深浅)     立体水晶透明效果边框一代码如下: <TABLE style="BORDER-RIGHT: 1px solid; ; BORDER-TOP: 1px solid; BORDER-LEFT: 1px solid; BORDER-BOTTOM: 1px solid" borderColor=#19050f height=225 cellSpacing=0 cellPadding=0 width=225 align=center border=0> <TBODY> <TR> <TD style="FILTER: alpha(opacity=100,finishopacity=10,style=2)" bgColor=#ff359a height=15 align=middle>立体水晶透明效果边框一</TD></TR> <TR> <TD height=210>内容(宽高自定义.调色要注意深浅)</TD></TR></TBODY></TABLE>     另类水晶透明效果边框二:   另类水晶透明效果边框二 内容(宽高自定义调色要注意深浅) 1 2 3 4 5      另类水晶透明效果边框二代码如下: <TABLE style="BORDER-RIGHT: 1px solid; ; BORDER-TOP: 1px solid; BORDER-LEFT: 1px solid; BORDER-BOTTOM: 1px solid" borderColor=#19050f height=225 cellSpacing=0 cellPadding=0 width=225 align=center border=0> <TBODY> <TR> <TD style="FILTER: alpha(opacity=100,finishopacity=10,style=2)" bgColor=#ff359a height=15 align=middle>另类水晶透明效果边框二</TD></TR> <TR> <TD height=195>内容(宽高自定义调色要注意深浅)</TD></TR> <TR> <TD style="FILTER: alpha(opacity=100,finishopacity=10,style=2)" align=right bgColor=#ff359a height=15>1 2 3 4 5 </TD></TR></TBODY></TABLE> 二十二、立体水晶透明效果边框一: 立体水晶透明效果边框一 内容(宽高自定义)     立体水晶透明效果边框一代码如下: <TABLE style="BORDER-RIGHT: 1px solid; ; BORDER-TOP: 1px solid; BORDER-LEFT: 1px solid; BORDER-BOTTOM: 1px solid" borderColor=#aa0055 height=225 cellSpacing=0 cellPadding=0 width=225 align=center border=0> <TBODY> <TR> <TD style="FILTER: alpha(opacity=100,finishopacity=10,style=3)" bgColor=#ff359a height=15 align=middle>立体水晶透明效果边框一</TD></TR> <TR> <TD height=210>内容(宽高自定义)</TD></TR></TBODY></TABLE>     立体水晶透明效果边框二:   立体水晶透明效果边框二 内容(宽高自定义) 1 2 3 4 5      立体水晶透明效果边框二代码如下: <TABLE style="BORDER-RIGHT: 1px solid; ; BORDER-TOP: 1px solid; BORDER-LEFT: 1px solid; BORDER-BOTTOM: 1px solid" borderColor=#aa0055 height=225 cellSpacing=0 cellPadding=0 width=225 align=center border=0> <TBODY> <TR> <TD style="FILTER: alpha(opacity=100,finishopacity=10,style=3)" bgColor=#ff359a height=15 align=middle>立体水晶透明效果边框二</TD></TR> <TR> <TD height=195>内容(宽高自定义)</TD></TR> <TR> <TD style="FILTER: alpha(opacity=100,finishopacity=10,style=3)" bgColor=#ff359a height=15 align=right> 1 2 3 4 5  </TD></TR></TBODY></TABLE> 二十三、渐淡透明效果边框一: 渐淡透明效果边框一 内容(宽高自定义)   渐淡透明效果边框一代码如下: <TABLE style="BORDER-RIGHT:1px solid; ; BORDER-TOP:1px solid; BORDER-LEFT:1px solid; BORDER-BOTTOM:1px solid" borderColor=#ff359a height=225 cellSpacing=0 cellPadding=0 width=225 align=center border=0> <TBODY> <TR> <TD style="FILTER: alpha(opacity=100,finishopacity=10,style=1)" bgColor=#ff359a height=15 align=middle>渐淡透明效果边框一</TD></TR> <TR> <TD height=210>内容(宽高自定义)</TD></TR></TBODY></TABLE>   渐淡透明效果边框二:   渐淡透明效果边框二 内容(宽高自定义) 1 2 3 4 5    渐淡透明效果边框二代码如下: <TABLE style="BORDER-RIGHT: 1px solid; ; BORDER-TOP: 1px solid; BORDER-LEFT: 1px solid; BORDER-BOTTOM: 1px solid" borderColor=#ff359a height=225 cellSpacing=0 cellPadding=0 width=225 align=center border=0> <TBODY> <TR> <TD style="FILTER: alpha(opacity=100,finishopacity=10,style=1)" bgColor=#ff359a height=15 align=middle>渐淡透明效果边框二</TD></TR> <TR> <TD height=195>内容(宽高自定义)</TD></TR> <TR> <TD style="FILTER: alpha(opacity=100,finishopacity=10,style=1)" bgColor=#ff359a height=15 align=right> 1 2 3 4 5</TD></TR></TBODY></TABLE>       * * 似 水 流 雲* * * 精 品 收 藏 * * 【原创随笔】 【历史天空】 【幽默爆笑】 【电子书籍】 【配乐素材】 【电脑上网】 【书法欣赏】 【朗诵素材】 【时事评论】 【生活百科】 【解说词集】 【八卦美图】 【人在职场】 【电视摄像】 【摄影旅游】 【非线编辑】 【音画欣赏】 【新闻采访】 【读天下书】 【股市风云】 【成长教育】 【空间资源】 【音乐简谱】 【琴棋胡舞】 【经典视频】 【制度集粹】 【总结文书】 【馆藏导读】 更多精彩   更多期待