订阅
上一篇
返回
下一篇
用css实现表格元素的颜色间变
作者: Aion 日期: 2006-05-01 09:21
用css实现表格行交替变色 方法一：
CODE:
用css实现表格行交替变色 方法二：
CODE:
用css实现单元格交替变色
CODE:
CODE:
<style>
.db { border-collapse:collapse;}
.db tr{ background-color:expression('#dbdbdb,#EFEFEF'.split(',')[rowIndex%2]); }
</style>
<table width="100%" border="1" class="db">
<tr>
<td> </td>
</tr>
<tr>
<td> </td>
</tr>
<tr>
<td> </td>
</tr>
<tr>
<td> </td>
</tr>
<tr>
<td> </td>
</tr>
<tr>
<td> </td>
</tr>
<tr>
<td> </td>
</tr>
<tr>
<td> </td>
</tr>
<tr>
<td> </td>
</tr>
</table>
用css实现表格行交替变色 方法二：
CODE:
<style by tesion.>
th {font-weight: normal; text-align:left; background: #CCCCCC}
td {background: #FAFAFA}
</style>
<table>
<tr>
<th>第一个颜色</th>
</tr>
<tr>
<td>第二个颜色</td>
</tr>
<tr>
<th>第一个颜色</th>
</tr>
<tr>
<td>第二个颜色</td>
</tr>
<tr>
<th>第一个颜色</th>
</tr>
<tr>
<td>第二个颜色</td>
</tr>
</table>
用css实现单元格交替变色
CODE:
<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>
引用通告地址:
标签:
评论: 19 |
引用: 3 |
阅读: 2035
出会い
发表评论
IE下网页显示为空白的解决办法 (2008-05-28 00:03)
楚都旅游 LAMP (2008-05-21 13:41)
Union (2008-02-25 17:20)
电信封锁BT/P2P的解决办法 (2008-01-06 10:58)
2007 fleeting time (2007-12-28 15:26)
LAMP架构的B2B系统 DIV+CSS (2007-12-09 16:35)
Nov.18.2007 Sacrifice (2007-11-18 02:48)
还让不让人说话了，伟大的ZF和D组织 (2007-08-30 23:04)
July.23.2007 开心的周末 (2007-07-24 00:06)