1、设置边框的BORDER=0
、cellspacing=1,设置Table的背景色为所要的边框色,再设置所有的td背景色为白色,这样细边框就显露出来了。这个方法有些邪气,看似不太正宗,但是也能达到效果,条条大路通罗马嘛!
再来看看第二种方法:
2、设置BORDER=0
,再通过CSS,给Table加上1px的border-top,border-left,然后再设置所有的td的border-right,border-bottom,这样也能达到所要的效果。可见CSS很是强大啊。
下面介绍一种更为简便有效的方法:
3、设置table的CSS为{border-collapse:collapseborder:none},再设置td的CSS为{border:solid #000 1px},大功告成!而且Word也能认出这种设置。
1.所有的<table>均为细边框。table,table td,table th{border:1px solid #ff0000border-collapse:collapse}
2.指定的<table>为细边框,把<table>放在<div>中,用ID作索引,如下:
#mdA table,#mdA table td,#mdA table th{border:1px solid #ff0000border-collapse:collapse}
<div id="mdA">
<table width="400" border="0" cellspacing="0" cellpadding="0">
<tr>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
</tr>
</table>
</div>
可以通过设置单元格元素td的边框样式来实现:
border: width style color /*分别设置边框的粗细、样式和颜色*/示例如下:
在HTML代码中给出两个表格
<table class="tb1"><tr><td>有</td><td>志</td><td>者</td></tr>
<tr><td>事</td><td>竟</td><td>成</td></tr>
</table>
<table class="tb2">
<tr><td>苦</td><td>心</td><td>人</td></tr>
<tr><td>天</td><td>不</td><td>负</td></tr>
</table>
分别设置不同的样式
table{ /* 表格整体样式 */margin:50px /* 外边距50px */
border-collapse:collapse /* 合并为单一的边框线 */
}
/* 设置tb1类的表格样式 */
table.tb1 td{padding:10pxborder:1px solid green}
/* 设置tb2类的表格样式 */
table.tb2 td{padding:20pxborder:5px dashed blue}
最终效果如下