两种细线表格做法

<br/> <br/> <br/> <br/> <br/> <br/>表格边线为1，线色为黑，行线色为白。 <br/> <br/> <br/> <br/> <br/> <br/><p> <br/> <br/> <br/> <br/> <br/> <br/>表格边线为0，间距为1，背景色为黑，行背景色为白。 <br/> <br/> <br/> <br/> <br/> <br/>
[Ctrl+A 全部选择 提示：你可先修改部分代码，再按运行]

立体表格

<br/> <br/> <br/> <br/> <br/> <br/>cnbruce <br/> <br/> <br/> <br/>cnbruce <br/> <br/> <br/> <br/>cnbruce <br/> <br/> <br/> <br/>cnbruce <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/>cnbruce <br/> <br/> <br/> <br/>cnbruce <br/> <br/> <br/> <br/>cnbruce <br/> <br/> <br/> <br/>cnbruce <br/> <br/> <br/> <br/> <br/> <br/><center>表格边线为1，间隔为0，左上为#333333，右下为#efefef,行背景色为#cccccc
[Ctrl+A 全部选择 提示：你可先修改部分代码，再按运行]

表格的边框不断在闪

<br/> <br/> <br/> <br/> <br/> <br/>cnbruce cnbruce cnbruce cnbruce cnbruce cnbruce <br/> <br/> <br/> <br/> <br/> <br/><script language="javascript1.2"> <br/> <br/></script>
[Ctrl+A 全部选择 提示：你可先修改部分代码，再按运行]

不用嵌套制作同一行放两个表格

<br/> <br/> <br/> <br/> <br/> <br/>-1 <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/>1 <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/>-1 <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/>1 <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/>hhh <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/>nnn <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/>-1 <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/>1 <br/> <br/> <br/> <br/> <br/> <br/>
[Ctrl+A 全部选择 提示：你可先修改部分代码，再按运行]

另类圆角表格制作

原图： <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/><p>放大 <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/>
[Ctrl+A 全部选择 提示：你可先修改部分代码，再按运行]

虚线边框表格

<br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/><center>www.cnbruce.com <br/> <br/> <br/> <br/> <br/> <br/><p>虚线直线1<hr size=1 style="border:1px dotted #001403;">虚线直线2<p size=1 style="border:1px dotted #001403;">
[Ctrl+A 全部选择 提示：你可先修改部分代码，再按运行]

分类型表格

<fieldset><legend>item</legend>content</fieldset>
[Ctrl+A 全部选择 提示：你可先修改部分代码，再按运行]

变色的单元格1，通过a:hover做.

<style>a:link,a:visited,a:hover{width:100%;text-decoration:none;font-family:verdana;font-size:10px;color:white}a:hover{background:#0099ff;color:black}td{background:#3366cc;color:white;padding:0px}</style> <br/> <br/> <br/> <br/> <br/> <br/><a href="#">CNBruce <br/> <br/><a href="#">.com <br/> <br/> <br/> <br/><a href="#">CNBruce <br/> <br/><a href="#">.com
[Ctrl+A 全部选择 提示：你可先修改部分代码，再按运行]

变色的单元格2，已经做成了CSS，注意还有透明效果。

<br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/><center><b>cnbruce <br/> <br/> <br/> <br/> <br/> <br/>
[Ctrl+A 全部选择 提示：你可先修改部分代码，再按运行]

变色的单元格3，通过mouse事件做.有点微软的味道。

<br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/>cnbruce <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/>cnbruce <br/> <br/> <br/> <br/> <br/> <br/>
[Ctrl+A 全部选择 提示：你可先修改部分代码，再按运行]

透明表格

<br/> <br/> <br/> <br/> <br/> <br/><center>cnbruce <br/> <br/> <br/> <br/> <br/> <br/>
[Ctrl+A 全部选择 提示：你可先修改部分代码，再按运行]

表格边框显示外阴影

<br/> <br/> <br/> <br/> <br/> <br/><center>www.cnbruce.com <br/> <br/> <br/> <br/> <br/> <br/>
[Ctrl+A 全部选择 提示：你可先修改部分代码，再按运行]

限制表格的大小。
style="table-layout:fixed;word-break:break-all"
无论大图还是文字，一律限制。

<br/> <br/> <br/> <br/> <br/> <br/><center><img src="http://127.0.0.1/Files/BeyondPic/2006-6/13/0661313162295549.jpg"> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/>cnbrucecnbrucecnbrucecnbrucecnbrucecnbrucecnbrucecnbrucecnbrucecnbrucecnbrucecnbrucecnbrucecnbrucecnbrucecnbrucecnbrucecnbrucecnbrucecnbruce <br/> <br/> <br/> <br/> <br/> <br/>
[Ctrl+A 全部选择 提示：你可先修改部分代码，再按运行]

根据单元格内容加亮

<br/> <br/> <br/> <br/> <br/> <br/>12 <br/> <br/> <br/> <br/>34 <br/> <br/> <br/> <br/>56 <br/> <br/> <br/> <br/>78 <br/> <br/> <br/> <br/>90 <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/>abc <br/> <br/> <br/> <br/>def <br/> <br/> <br/> <br/>ghj <br/> <br/> <br/> <br/>lop <br/> <br/> <br/> <br/>dry <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/>!@# <br/> <br/> <br/> <br/>_(* <br/> <br/> <br/> <br/>#$% <br/> <br/> <br/> <br/>^$# <br/> <br/> <br/> <br/>WWW <br/> <br/> <br/> <br/> <br/> <br/><SCRIPT>var ids;var idstext;function hightlight_td(){var text=txt.value;TDs=document.all.table1.all.tags("TD")//使用iframe时://TDs=iframe的name.document.all.table1.all.tags("TD") if (text!="") { for (var i = 0; i < TDs.length; i++) { obj=TDs[i]; idstext=obj.innerText; idnum=idstext.indexOf(text); if (idnum!=-1) { obj.style.background="red"; } else { obj.style.background="#FFFFFF"; } } } else { alert("没有输入"); }}</SCRIPT><p align="center"><input type="text" name="txt" value=""><input type="button" value="请输入要查的字符串." onClick="hightlight_td();"></p>
[Ctrl+A 全部选择 提示：你可先修改部分代码，再按运行]

VML做圆脚表格

运行代码框
<html xmlns:v><style>v\:*{behavior:url(#default#VML)}</style><body> <v:RoundRect style="position:relative;width:150;height:240px"> <v:shadow on="T" type="single" color="#b3b3b3" offset="3px,3px"/> <v:TextBox style="font-size:10.2pt;">VML</v:TextBox> </v:RoundRect> </body></html>
[Ctrl+A 全部选择 提示：你可先修改部分代码，再按运行]

运行代码框
<html xmlns:v><style>v\:*{behavior:url(#default#VML)}</style><body> <v:RoundRect style="position:relative;width:150;height:240px"><v:path textpathok="true" /> <v:textpath on="true" string="cnbrucecnbrucecnbrucecnbrucecnbrucecnbrucecnbrucecnbrucecnbrucecnbrucecnbrucecnbrucecnbrucecnbrucecnbruce" /> <v:shadow on="T" type="single" color="#b3b3b3" offset="3px,3px"/> <v:TextBox style="font-size:10.2pt;">VML</v:TextBox> </v:RoundRect> </body></html>
[Ctrl+A 全部选择 提示：你可先修改部分代码，再按运行]

运行代码框
<html xmlns:v><style>v\:*{behavior:url(#default#VML)}</style><body> <v:RoundRect style="position:relative;width:150;height:240px" arcsize=0.5> <v:shadow on="T" type="single" color="#b3b3b3" offset="3px,3px"/> <v:TextBox style="font-size:10.2pt;">VML</v:TextBox> </v:RoundRect> </body></html>
[Ctrl+A 全部选择 提示：你可先修改部分代码，再按运行]

最后，还请关注蓝色理想的另篇《表格边框魔鬼教程》

http://www.blueidea.com/tech/web/2003/302.asp