三种细边框表格的实现方法比较

1.背景设置式－细边框表格

< html >
< head >
   < title > 背景设置式－细边框表格 </ title >
</ head >
< body >
   < table  width ="200"  border ="0"  cellpadding ="2"  cellspacing ="1"  bgcolor ="#000000" >
     < tr >
       < th  bgcolor ="#FFFFEE"  colspan ="2" > 背景设置式－细边框表格 </ th >
     </ tr >
     < tr >
       < td  bgcolor ="#FFFFEE" > text </ td >
       < td  bgcolor ="#FFFFEE" > text </ td >
     </ tr >
     < tr >
       < td  bgcolor ="#FFFFEE" > text </ td >
       < td  bgcolor ="#FFFFEE" > text </ td >
     </ tr >
   </ table >
</ body >
</ html >

2.边框设置式－细边框表格

< html >
< head >
   < title > 边框设置式－细边框表格 </ title >
</ head >
< body >
   < table  width ="200"  border ="1"  cellpadding ="2"  cellspacing ="0"  bordercolorlight ="#000000"  bordercolordark ="#FFFFFF"  bgcolor ="#FFFFEE" >
     < tr >
       < th  colspan ="2" > 边框设置式－细边框表格 </ th >
     </ tr >
     < tr >
       < td > text </ td >
       < td > text </ td >
     </ tr >
     < tr >
       < td > text </ td >
       < td > text </ td >
     </ tr >
   </ table >
</ body >
</ html >

3.CSS 层叠式－细边框表格

< html >
< head >
   < title > CSS 层叠式－细边框表格 </ title >
< style  type ="text/css" >
<!--
.T_Sample {}{
  border-collapse: collapse;
  border: none;
  background: #FFFFEE;
}
.T_Sample th {}{
  border: solid 1px #000000;
}
.T_Sample td {}{
  border: solid 1px #000000;
}
-->
</ style >
</ head >
< body >
   < table  width ="200"  border ="1"  cellpadding ="2"  cellspacing ="0"  class ="T_Sample" >
     < tr >
       < th  colspan ="2" > CSS 层叠式－细边框表格 </ th >
     </ tr >
     < tr >
       < td > text </ td >
       < td > text </ td >
     </ tr >
     < tr >
       < td > text </ td >
       < td > text </ td >
     </ tr >
   </ table >
</ body >
</ html >

	大小(字节)	打印兼容	灵活性	点评	适合场合
背景设置式	609	×	☆	此设置方式可能是因为动网论坛才会得到广泛使用的。这种方式在打印时是完全看不到表格线的，要对每个<td>设置背景颜色才可以修改颜色。	不需打印；要实现相间背景色的单元格的场合
边框设置式	572	☆	★	此设置方式只须修改一行的<table>的属性就可以实现。在打印时只有底边和右边的表格线是细线，而其他的均出现粗线。另外，部分非IE内核浏览器可能不支持，如FireFox。	对打印需求不高；因为只须修改一行，所以容易复制使用，适合使用率高而颜色变化不大的场合
CSS 层叠式	749	★	★★	此设置方式是MSOffice的另存为所采用的方式。对边框打印完全显示。如果设定好CSS，那么只须设置每个<table>的Class属性即可修改。由于CSS的继承性，所以会影响到其嵌套表格的样式，除非设置另外的Class属性。	对打印需求高；适合大网站的换肤设计；但要求会运用CSS样式表

转载于:https://www.cnblogs.com/hakkas/archive/2006/04/28/387096.html