本文实例讲述了css实现兼容火狐、IE的LI奇偶行颜色交替方法。分享给大家供大家参考。具体如下：
这是一款兼容火狐、IE的LI颜色交替的方法，实则是平铺的背景， 不过 相对使用JS，平铺背景也不失为一种好方法，因为处理一个GIF图像也不 是什么 难办的事，最其码比使用JS的要兼容性好许多，你可以在不同的浏览器下试一下。
运行效果截图如下：
在线演示地址如下：
http://demo.jb51.net/js/2015/css-firefox-ie-line-color-demo/
具体代码如下：
复制代码
代码如下:<!DOCTY PE ht ML P ub LIC "-//W3C//DTD XHTML 1.0 Trans IT ional//EN"
"http://HdhCmsTestw3. org /TR/xhtml1/DTD/xhtml1 -t ransitional.dtd">
<html XM lns="http://HdhCmsTestw3.org/1999/xhtml">
<head>
< ;m eta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>CSS实现奇偶数行颜色交替方法</title>
<style type="text/css">
<-- * {
m arg in:0;
padding:0;
}
body {
background: # FFF;
font:12px Geneva, Arial, Helvetica, sans -s erif #000;
line-h ei ght:1;
text-align: center ;
}
a:link, a:visited {
text-decoration:none;
color:#000;
}
a:hover {
text-decoration:underline;
color:#39c;
}
img {
border:0;
}
select {
border:0;
}
ul, li {
list-style:none;
}
h1 {
font- Size: 14px;
font-weight :bold;
color:#444;
}
.list {
width:320px;
mar gin :0 auto;
}
.list ul {
background:url(images/row_bg.gif);
}
.list li {
height:25px;
line-height:25px;
text-align:left;
padding-left:10px;
}
-->
</style>
</head>
<body>
<div class="list">
<ul>
<li> 奇数 行 .. .....</li>
<li>偶数行.......</li>
<li>奇数行.......</li>
<li>偶数行.......</li>
<li>奇数行.......</li>
</ul>
</div>
</body>
</html>
希望本文所述对大家的css网页设计有所帮助。
总结
以上是 为你收集整理的 css实现兼容火狐、IE的LI奇偶行颜色交替方法 全部内容，希望文章能够帮你解决 css实现兼容火狐、IE的LI奇偶行颜色交替方法 所遇到的问题。
如果觉得 网站内容还不错， 推荐好友。
查看更多关于css实现兼容火狐、IE的LI奇偶行颜色交替方法的详细内容...