在外部CSS中实现Table td的colspan

个人感觉Table布局一直都是比较麻烦的

前阵子有个客户需求，要把下面代码中的colspan=3去掉，在外部css中定义

< table  border ="2px" >
     < tr >
         < td  colspan ="3"   >
            table content
         </ td >
     </ tr >
     < tr >
         < td >
            table content
         </ td >
         < td >
            table content
         </ td >
         < td >
            table content
         </ td >
     </ tr >
</ table >

 

由于css中td并没有colspan属性，所以非常令人头痛，可以说是没办法实现的

最后用这么个方法忽悠了他：

< style  type ="text/css" >
    .tdcolspan
     {
        test :  expression(this.colSpan="3") ;
     }
</ style >
< table  border ="2px" >
     < tr >
         < td  class ="tdcolspan" >
            table content
         </ td >
     </ tr >
     < tr >
         < td >
            table content
         </ td >
         < td >
            table content
         </ td >
         < td >
            table content
         </ td >
     </ tr >
</ table >

 

如代码所示，IE的css expression到是可以实现需求：

 

然而，需要注意的是：

expression只能在IE下使用

expression一般不要使用，会消耗不少资源