用CSS写出的网页动态表格交替颜色的效果

[ 来路：21kn.com    时间：2007-7-7 20:58:59    点击： ]

<style type="text/css"><!-- tr {background-color:expression((this.sectionRowIndex%2==0)?"#419C33":"#CCEBC7")} --></style></HEAD><table><tr><td> evilpaw1</td><td>evilpaw 1</td></tr><tr><td>evilpaw2</td><td> evilpaw 2</td></tr><tr><td>evilpaw3</td><td>evilpaw3</td></tr><tr><td>evilpaw 4</td><td>evilpaw4</td></tr><tr><td>evilpaw5</td><td>evilpaw 5</td></tr></table>

    [Ctrl+A 全部选择 提示：你可先修改部分代码，再按运行]

<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>

    [Ctrl+A 全部选择 提示：你可先修改部分代码，再按运行]

上一篇：网页制作中养成良好的CSS编码习惯  下一篇：如何使文本在DIV+CSS布局中垂直居中