表格实现每行一种颜色

  • Post author:
  • Post category:其他


1. 每行不同




<


style


type


=”text/css”


>






<!–



tr




{



background-color


:


expression((this.sectionRowIndex==0)?””:


(this.sectionRowIndex%2==0)?”red”:”blue”)


}





–>





</


style


>






</


HEAD


>






<


table


>






<


tr


>






<


td


>


第1行


</


td


><


td


>


第1行


</


td


>






</


tr


>






<


tr


>






<


td


>


第2行


</


td


><


td


>


第2行


</


td


>






</


tr


>






<


tr


>






<


td


>


第3行


</


td


><


td


>


第3行


</


td


>






</


tr


>






<


tr


>






<


td


>


第4行


</


td


><


td


>


第4行


</


td


>






</


tr


>






<


tr


>






<


td


>


第5行


</


td


><


td


>


第5行


</


td


>






</


tr


>






</


table


>

2. 每行每个单元格不同




<


style


type


=”text/css”


>






<!–



tr




{



background-color


:


expression((this.sectionRowIndex%2==0)?”red”:”blue”)


}






td




{



background-color


:


expression((this.cellIndex%2==0)?””:((this.parentElement.sectionRowIndex%2==0)?”green”:”yellow”))


}





–>





</


style


>






</


HEAD


>






<


table


>






<


tr


><


td


>


第1行


</


td


><


td


>


第1行


</


td


><


td


>


第1行


</


td


><


td


>


第1行


</


td


><


td


>


第1行


</


td


></


tr


>






<


tr


><


td


>


第2行


</


td


><


td


>


第2行


</


td


><


td


>


第2行


</


td


><


td


>


第2行


</


td


><


td


>


第2行


</


td


></


tr


>






<


tr


><


td


>


第3行


</


td


><


td


>


第3行


</


td


><


td


>


第3行


</


td


><


td


>


第3行


</


td


><


td


>


第3行


</


td


></


tr


>






<


tr


><


td


>


第4行


</


td


><


td


>


第4行


</


td


><


td


>


第4行


</


td


><


td


>


第4行


</


td


><


td


>


第4行


</


td


></


tr


>






<


tr


><


td


>


第5行


</


td


><


td


>


第5行


</


td


><


td


>


第5行


</


td


><


td


>


第5行


</


td


><


td


>


第5行


</


td


></


tr


>






</


table


>