首页
网页制作
网络编程
脚本专栏
数据库
网站运营
网络安全
平面设计
CMS教程
搜索
建站极客
网络编程
CSS/HTML
正文
css expression 隔行换色
所属分类：
网络编程
/
CSS/HTML
阅读数： 1628
收藏 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需再刷新一下页面才能执行
]
更多精彩内容
其他人还在看
input文本框样式代码实例
input文本框样式代码实例
评论 0
收藏 0
赞 0
分享
div+css实现自适应宽度按钮
div+css实现自适应宽度按钮
评论 0
收藏 0
赞 0
分享
h1标签的使用技巧
h1标签的使用技巧
评论 0
收藏 0
赞 0
分享
base href 使用方法详解
base href 使用方法详解
评论 0
收藏 0
赞 0
分享
html label标签的使用教程
html label标签的使用教程
评论 0
收藏 0
赞 0
分享
使用CSS不用程序实现文字自动截断 用省略号代替
使用CSS不用程序实现文字自动截断 用省略号代替
评论 0
收藏 0
赞 0
分享
CSS hack实现 CSS完美兼容IE6/IE7/FF的通用方法
CSS hack实现 CSS完美兼容IE6/IE7/FF的通用方法
评论 0
收藏 0
赞 0
分享
网页布局+纯CSS纵向下拉菜单 IE6/IE7兼容
网页布局+纯CSS纵向下拉菜单 IE6/IE7兼容
评论 0
收藏 0
赞 0
分享
CSS图片拼合生成器只需上传zip包即可
CSS图片拼合生成器只需上传zip包即可
评论 0
收藏 0
赞 0
分享
用iframe margin实现调用其他网页的某一区域的方法
用iframe margin实现调用其他网页的某一区域的方法
评论 0
收藏 0
赞 0
分享
查看更多
网络赚钱
更多
朋友圈疯传的万能Wi-Fi账号是假的 犯了常识性错误
最强PS网银汇款截图：轻松骗走网店17万奢侈品
青西一女子轻信网络刷单2小时赚400元 被骗15万元
网上怎么赚钱 网络赚钱需要注意哪些东西
站长故事实战：淘宝买关键词排名SEO服务攻略介绍
网站如何靠SEO盈利？先把网站包装成专卖店吧
站长故事
更多
为什么被黑的总是小米？
论诺基亚之死！
木屋烧烤创始人自述：屌丝的逆袭开餐饮店 连锁餐饮成功的五个因素
我认识的互联网活化石金山劳模雷军
站长从菜鸟到资深必经过程
网站被K到恢复收录与排名我做了什么
