模板无忧
网页特效
每日更新
|
TOP排行榜
|
Tag标签
|
充值
无忧首页
网页模板
程序模板
建站教程
视频教程
网页特效
图标素材
字体下载
站长工具
站长问答
网页特效
菜单导航
图片特效
文本链接
层和布局
页面背景
表单按钮
日期时间
计算转换
键盘鼠标
浏览器
游戏娱乐
综合其它
常用代码
jQuery特效
Prototype
Ajax/JavaScript
ExtJS
CSS特效
在线编辑器
Mootools
HTML
JS广告代码合集
站长工具
站长常用软件
网站综合查询
Alexa排名查询
Google PR查询
域名Whois查询
网站收录查询
友情链接查询
CSS2中文手册
CSS精简优化工具
网页特效代码
模板无忧
>
网页特效
>
层和布局特效代码
>
收藏
分享
查看评论
层和布局
演示
Js实现表格隔行换色一例_层和布局特效
查看演示效果
特效Tag：
隔行换色
添加
Js实现表格隔行换色一例，这种效果网上已经有很多啦，每一种都有特色，请大家选择使用。
<!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"> <head> <meta http-equiv="Content-Type" mrc="text/html; charset=utf-8" /> <title>Js实现表格隔行换色一例</title> <style type="text/css"> body{ padding:0; margin:0; font:Arial; font-size:12px;} .bf{ padding:0; margin:auto;} .bf table{ text-align:center;line-height:14pt;} .bf th{ width:50px; padding:10px;} .f1{ background:#fff8f0;} .f2{ background:#f0f7ff;} .f3{ background:#f7f7f7;} </style> </head> <body> <div class="bf"> <table border="1" bordercolor="#00CCFF" cellspacing="0" > <caption>2006～2009年度资产统计表</caption> <tr class="b"> <th></th> <th scope="col">2006年</th> <th scope="col">2007年</th> <th scope="col">2008年</th> <th scope="col">2009年</th> </tr> <tr class="b"><th scope="row" rowspan="4">总</th></tr> <tr> <td>4</td> <td>2</td> <td>56</td> <td>43</td> </tr> <tr> <td>10</td> <td>4</td> <td>10</td> <td>10</td> </tr> <tr> <td>10</td> <td>76</td> <td>10</td> <td>9</td> </tr> <tr class="b"><th scope="row" rowspan="4">总</th></tr> <tr> <td>10</td> <td>10</td> <td>10</td> <td>10</td> </tr> <tr> <td>2</td> <td>10</td> <td>12</td> <td>10</td> </tr> <tr> <td>10</td> <td>10</td> <td>10</td> <td>10</td> </tr> <tr class="b"><th scope="row" rowspan="4">总</th></tr> <tr> <td>10</td> <td>5</td> <td>10</td> <td>10</td> </tr> <tr> <td>10</td> <td>7</td> <td>10</td> <td>3</td> </tr> <tr> <td>10</td> <td>5</td> <td>7</td> <td>8</td> </tr> </table> </div> <script type="text/javascript"> var bg=document.getElementsByTagName('tr'); for(var i=0,j=0;i<bg.length;i++) { if(bg[i].className!='b') { j++; bg[i].className=j%2==0?'f1':'f2'; } else {bg[i].className='f3'} } </script> </body> </html>
所属频道：
层和布局特效
/
更新时间：2012-12-20
[收藏]
[报错]
[返回列表]
相关
层和布局特效
：
表格内容排序sortTable
行变成列，列变成行
文本输入限制
拆分单元格
控制表格内的滚动条
颜色交替的表格
JS计算里面有多少个
极酷的表格
会动的表格
可拖动单元格
变色表格
访问表格的每个TD
层和布局特效Rss订阅
特效代码搜索
层和布局特效推荐
拆分单元格
一个左图右文的简单CSS布局
层收缩/展开的代码
一款常见的图文混排的Blog文章列表
给一个Div层添加滚动条功能
一个很不错的表格边框循环发光的特效JS
缓冲展开/关闭层
CSS代码实现网页柱状图
鼠标可以拖动的嵌套表格(JavaScript)
Javascript 滑动的说明文字提示效果
猜你也喜欢看这些
弹出提示的效果
从由下脚自动弹出的一个小POP窗口
星星飞舞
随滚动条滚动的QQ客服咨询特效代码
鼠标放上链接改变网页背景颜色
JS控制网页背景图片斜向滚动
页面下沉抖动效果
鼠标使链接变色：鼠标放到链接上，每放一次都会出现不同的背景色
点击链接后跳出一个链接说明小窗口
Java Script 颜色梯度和渐变效果
相关链接：
复制本页链接
|
搜索Js实现表格隔行换色一例
特效说明：
层和布局模板
-
Js实现表格隔行换色一例
。
。。