用css来定义table的样式

div写多了，偶尔遇到table现在还觉得麻烦，又是边框，又是间距什么的，觉得定义太多，看看我遇到的一个table

代码如下：

<table cellspacing="0" cellpadding="8" width="100%" bordercolor="#C4E2FF" bordercolordark="#FFFFFF" bgcolor="#E8FBFF" border="1">

    <tr>

    <td align="right" width="17%">QQ号码：</td>

    <td align="left" width="83%">123456</td>

    </tr>

    <tr>

    <td align="right">MSN：</td>

    <td align="left">123456@1222.com</td>

    </tr>

</table>

看看定义挺多的吧，还不兼容，bordercolordark这个在firefox和opera就不行，表格在ie是细线有颜色，到了firefox，opera就变粗变黑，丑死。

试试用css来定义吧，找了一堆网站，被我搞定，代码如下：

<style>

table{border-collapse:collapse;border:1px solid #C4E2FF;background:#E8FBFF;width:100%;}

td{padding:10px 5px;line-height:40px;border:1px solid #C4E2FF;}

</style>

<table>

    <tr>

    <td align="right" width="17%">QQ号码：</td>

    <td align="left" width="83%">123456</td>

    </tr>

    <tr>

    <td align="right">MSN：</td>

    <td align="left">123456@1222.com</td>

    </tr>

</table>

注意border-collapse:collapse;是保证在firefox，opera下面细线的关键，并且td要加上border要不然里面就没有线了。

ok，ie/firefox/opera测试通过，把table解放出来真好：）