站长论坛

标题: dreamweaver中极细表格边框制作方法 [打印本页]

作者: superadmin    时间: 2009-11-4 11:32
标题: dreamweaver中极细表格边框制作方法
方法1:利用亮边框和暗边框[推荐]
<table width="100%" height="100" border="1" bordercolorlight="red" bordercolordark="white" cellpadding="0" cellspacing="0"> <tr>
<td>www.code-123.com</td>
<td>www.code-123.com</td>
</tr>
<tr>
<td>www.code-123.com</td>
<td>www.code-123.com</td>
</tr>
</table>

方法2:利用collapse[推荐]
<table width="100%" height="100" border="1" bordercolor="blue" cellspacing="0" style="border-collapse:collapse">
<tr>
<td>www.code-123.com</td>
<td>www.code-123.com</td>
</tr>
<tr>
<td>www.code-123.com</td>
<td>www.code-123.com</td>
</tr>
</table>

方法3:(表格嵌套)
<table width="100%" border="0" cellspacing="0" cellpadding="0" bgcolor="#ff0000"> <tr>
<td>
   <table width="100%" border="0" cellspacing="1" cellpadding="0">
   <tr bgcolor="#ffffff">
    <td>极细表格边框</td>
    <td>极细表格边框</td>
    <td>极细表格边框</td>
   </tr><tr bgcolor="#ffffff">
    <td>极细表格边框</td>
    <td>极细表格边框</td>
    <td>极细表格边框</td>
   </tr>
</table>
</td>
</tr>
</table>

方法4:(用css实现)
<div id="table">
<table width="100%" border="0" >
<tr>
    <td>极细表格边框</td>
    <td>极细表格边框</td>
    <td>极细表格边框</td>
</tr>
<tr>
    <td>极细表格边框</td>
    <td>极细表格边框</td>
    <td>极细表格边框</td>
</tr>
</table>
</div>

方法5:利用单元格的间距
<table width="100%" height="100" border="0" bgcolor="red" cellpadding="0" cellspacing="1"> <tr>
<td bgcolor="white">www.code-123.com</td>
<td bgcolor="white">www.code-123.com</td>
</tr>
<tr>
<td bgcolor="white">www.code-123.com</td>
<td bgcolor="white">www.code-123.com</td>
</tr>
</table>




欢迎光临 站长论坛 (http://tzlink.com/bbs/) Powered by Discuz! X3.2