当前位置: 首页 > 图文教程 > 网页制作 > CSS样式表 > CSS网页隔行换色技巧

CSS样式表
CSS教程:网页空格引起网页布局间距问题
CSS制作网页时遇到问题的快速参考技巧
如何让position:fixed在IE6中工作
CSS技巧:网页文字渐变效果
CSS英文教程:CSS语法
CSS Sprite优化:减少HTTP链接数
CSS优先级你知道怎么用吗?
css的优先级和!important与ie6的BUG
YUI Compressor压缩JavaScript的内容
只用css制作圆角
企业网站网页设计常用参考
CSS网页制作教程:overflow属性
CSS优化:less优化CSS
CSS教程:透明度属性
CSS教程:通过实例学习CSS布局网页
CSS基础教程:网页图文混排的10个技巧
CSS教程:CSS选择器性能
CSS教程:简化CSS选择器
CSS网页布局实例:常见的12种网页布局
CSS教程:关于浮动

CSS样式表 中的 CSS网页隔行换色技巧


出处:互联网   整理: 软晨网(RuanChen.com)   发布: 2009-10-12   浏览: 99 ::
收藏到网摘: n/a

  CSS隔行换色的问题,其实很简单,您可以根据您的需要,采用下面的任何一种方法,当然,要适合你的编码与需求情况:
一、background背景图片
  如果行高固定的话,推荐使用背景图,也推荐将行高固定!兼容一切浏览器。
二、CSSExpression
  文字:color:expression(this.sourceIndex%2?'#ff0000':'#000000');
  背景:background-color:expression(this.sourceIndex%2?'#ff0000':'#000000');
  注意:本方法浏览器兼容度不够,不支持FF3。
三、class分别定义
<ul>
<liclass="bgcolor">...
<li>...
<liclass="bgcolor">...
<li>...
</ul>
实实在在的写法。
四、通过JS看实例

运行代码框

[Ctrl A 全部选择 提示:你可先修改部分代码,再按运行]