CSS顶替bordercolorlight与bordercolordark

我们可以使用 bordercolorlight 与 bordercolordark 来设置 Table 的边框，使之变得漂亮；

1、 bordercolorlight 与 bordercolordark 的用法（ 这种用法只限于 IE ）

< table cellspacing ="0" bordercolordark ='#D3D8E0' bordercolorlight ='#4F7FC9' cellpadding ="5" border ="1" width ="80%">

??????? < tr >

??????????? < td style =" background-color :#e3efff ;">

??????????????? 第一行 e3efff

??????????? </ td >

??????? </ tr >

??????? < tr >

??????????? < td style =" background-color :#f5f9ff ;">

??????????????? 第二行 f5f9ff

??????????? </ td >

??????? </ tr >

??? </ table >

2、 通过 css 设置边框属性达到同样的效果

< style type ="text/css">

??? TABLE.colorTest {??

??????? border-top : 1px solid #4F7FC9 ;???

??????? border-left : 1px solid #4F7FC9 ;???

??????? border-right : 0px ;???

??????? border-bottom : 0px ;???

??? }??

??? .colorTest TD {

??????? border-top : 1px solid #D3D8E0 ;???

??????? border-left : 1px solid #D3D8E0 ;???

??????? border-right : 1px solid #4F7FC9 ;???

??????? border-bottom : 1px solid #4F7FC9 ;??

??? }??

</ style >

Table 可以使用上面定义的样式达到同样的效果，而且是多浏览器中；

< table class ="colorTest" cellpadding ="1" cellspacing ="0" border ="1px" width ="80%" border ="1">

??? < tbody >

??????? < tr bgcolor ="#e3efff">

??????????? < td >

??????????????? 第一行

??????????? </ td >

??????? </ tr >

??????? < tr bgcolor ="#f5f9ff"> ??

??????????? < td >

???????????? ??? 第二行

??????????? </ td >

??????? </ tr >

??? </ tbody >

</ table >