您现在的位置:首页 --> JavaScript --> JS+CSS实现隔行换色
JS+CSS实现隔行换色
浏览:5169次 出处信息
以下是引用片段: <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>链接背景色隔行显示</title> </head> <style> .mytable {border-collapse:collapse;border:solid #6AA70B;border-width:0px 0 0 0px;width:50%;} .mytable ul li {padding-top:5px;text-indent:2em;list-style:none;background:url(http://www.blueidea.com/img/common/new_flash.gif) 3px 50% no-repeat;border-bottom:#6AA70B 1px dotted ;font-family: "Verdana,宋体";font-size: 12px;color:#008000;text-align:left;height:25px;} .mytable ul li.t1 {background-color:#EFFEDD;}/* 第一行的背景色 */ .mytable ul li.t2{background-color:#ffffff;}/* 第二行的背景色 */ .mytable ul li.t3 {padding-top:5px;text-indent:2em;list-style:none;background:url(http://www.blueidea.com/img/common/new.gif) #D2FCA0 3px 50% no-repeat;border-bottom:#6AA70B 1px dotted ;font-family: "Verdana,宋体";font-size: 12px;color:#008000;text-align:left;height:25px;}/* 鼠标经过时的背景色 */ </style> <body> <div id=tab> <ul> <li><a href="#">这个是第1行的文字,大家看清楚了</a></li> <li><a href="#">这个是第2行的文字,大家看清楚了</a></li> <li><a href="#">这个是第3行的文字,大家看清楚了</a></li> <li><a href="#">这个是第4行的文字,大家看清楚了</a></li> <li><a href="#">这个是第5行的文字,大家看清楚了</a></li> <li><a href="#">这个是第6行的文字,大家看清楚了</a></li> <li><a href="#">这个是第7行的文字,大家看清楚了</a></li> <li><a href="#">这个是第8行的文字,大家看清楚了</a></li> <li><a href="#">这个是第9行的文字,大家看清楚了</a></li> </ul></div><script type="text/javascript"> </script> </body> </html> |
建议继续学习:
- 50个活力和动感的网页设计-颜色的灵感 (阅读:32914)
- 分享一个JQUERY颜色选择插件 (阅读:12650)
- colortail,让 tail 命令绚丽起来 (阅读:8771)
- 色轮,用科学解释艺术 (阅读:8806)
- jQuery Color Animations颜色动画插件 (阅读:7088)
- 颜色的代码表达式 (阅读:6509)
- 终端二则 (阅读:5786)
- IE 颜色 Hack全收集 (阅读:4039)
- 色板 -- 颜色收集 (阅读:2541)
- 十六进制HTML颜色 (阅读:2462)
QQ技术交流群:445447336,欢迎加入!
扫一扫订阅我的微信号:IT技术博客大学习
扫一扫订阅我的微信号:IT技术博客大学习
文章信息
- 作者:标点符 来源: 标点符
- 标签: 隔行 颜色
- 发布时间:2009-12-13 20:20:43
建议继续学习
近3天十大热文
- [54] IOS安全–浅谈关于IOS加固的几种方法
- [52] android 开发入门
- [52] 如何拿下简短的域名
- [51] 图书馆的世界纪录
- [49] Go Reflect 性能
- [49] Oracle MTS模式下 进程地址与会话信
- [47] 【社会化设计】自我(self)部分――欢迎区
- [46] 读书笔记-壹百度:百度十年千倍的29条法则
- [37] 程序员技术练级攻略
- [29] 视觉调整-设计师 vs. 逻辑