首页
网页制作
网络编程
脚本专栏
数据库
网站运营
网络安全
平面设计
CMS教程
搜索
建站极客
网络编程
CSS/HTML
正文
css expression 隔行换色
所属分类：
网络编程
/
CSS/HTML
阅读数： 1594
收藏 0
赞 0
分享
css实现的，用expression但在实际中部建议使用，占用资源而且firefox浏览器不支持
<table width="500" 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> <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> <tr> <td> </td> </tr> <tr> <td> </td> </tr> <tr> <td> </td> </tr> <tr> <td> </td> </tr> </table>
[Ctrl+A 全选 注:
引入外部Js需再刷新一下页面才能执行
]
就两颜色的时候可以改这这样
<style>
.db tr{
background-color:expression('#abcdef,#123456'.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> <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> <tr> <td> </td> </tr> <tr> <td> </td> </tr> <tr> <td> </td> </tr> <tr> <td> </td> </tr> </table> </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> <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>
[Ctrl+A 全选 注:
引入外部Js需再刷新一下页面才能执行
]
如果真想用，可以用下面的js写的
<table id="list" width="300"> <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>
[Ctrl+A 全选 注:
引入外部Js需再刷新一下页面才能执行
]
更多精彩内容
其他人还在看
Mozilla建议的CSS书写顺序
Mozilla建议的CSS书写顺序
评论 0
收藏 0
赞 0
分享
微软终于对网页三剑客下手了
微软终于对网页三剑客下手了
评论 0
收藏 0
赞 0
分享
div＋css布局入门
div＋css布局入门
评论 0
收藏 0
赞 0
分享
HTML中的数据绑定
HTML中的数据绑定
评论 0
收藏 0
赞 0
分享
CSS定义通用透明效果
CSS定义通用透明效果
评论 0
收藏 0
赞 0
分享
一段巧妙的css debug代码
一段巧妙的css debug代码
评论 0
收藏 0
赞 0
分享
display&position
display&position
评论 0
收藏 0
赞 0
分享
布局遇到的问题 非常不错的见解
布局遇到的问题 非常不错的见解
评论 0
收藏 0
赞 0
分享
表格斜线
表格斜线
评论 0
收藏 0
赞 0
分享
利用CSS控制SELECT中的OPTION是否不允许选
利用CSS控制SELECT中的OPTION是否不允许选
评论 0
收藏 0
赞 0
分享
查看更多
网络赚钱
更多
潘定国的粉丝经济学的重点：移动互联网核心是以人为本
网赚感悟：网站为什么不赚钱?网赚没你想的那么简单
教育培训类网站的盈利模式
2017自媒体账号申请及运营的几点建议
站长必看:让你的网站多一种赚钱方法
草根站长靠什么赚钱?什么样的人能成为赚钱的草根站长?
站长故事
更多
一个个人站长的网站推广运营核心销策略
运用互联网思维的肉夹馍西少爷
30岁seo老鸟走过的路：从无知到精通需要时间和精力
我是怎么赚到人生的第一个百万的
PHPWind
网站被K到恢复收录与排名我做了什么
