CSS实现各行变色。
2012-02-01 15:30
120 查看
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<title>Test</title>
<style type="text/css">
tr
{
background: #FF3;
}
tr:nth-child(2n)
{
background: #6F9;
}
tr
{
background-color: expression((this.sectionRowIndex % 2 == 0) ? "#FF3" : "#6F9" );
}
</style>
</head>
<body><table>
<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>
<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>
</body>
</html>
<html xmlns="http://www.w3.org/1999/xhtml">
<title>Test</title>
<style type="text/css">
tr
{
background: #FF3;
}
tr:nth-child(2n)
{
background: #6F9;
}
tr
{
background-color: expression((this.sectionRowIndex % 2 == 0) ? "#FF3" : "#6F9" );
}
</style>
</head>
<body><table>
<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>
<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>
</body>
</html>
相关文章推荐
- jquery实现隔行变色,点击换色,鼠标悬浮当前行变色效果,div+css 细表格样式
- CSS+DIV实现鼠标经过背景变色
- 表格隔行变色_CSS实现鼠标悬停高亮
- 鼠标经过背景变色,CSSJavascript实现表格背景变色
- CSS+DIV实现鼠标经过背景变色 [onmouseover; onmouseout]
- CSS+DIV实现鼠标经过背景变色
- CSS实现鼠标悬停图片时的边框变色效果
- 用css实现表格行交替变色
- 用javascript/css实现GridView行背景色交替、点击行变色
- 用css实现表格行交替变色
- 实现GridView行背景色交替、点击行变色(javascript/css)
- CSS实现鼠标滑过表格变色
- CSS+DIV实现鼠标经过背景变色
- html和css实现 字体变色 旋转 图标渐变
- 一个用CSS实现隔行变色的技术
- css 实现table 隔行变色
- 一个用CSS实现隔行变色的技术
- ajax+js+dom+json+php+mysql实现漂亮的表格各行变色与google分页效果
- CSS+DIV实现鼠标经过背景变色
- 用CSS怎样实现鼠标移上去背景颜色变色 onmouseover、onmouseout