css实现兼容火狐、IE的LI奇偶行颜色交替方法

本文实例讲述了css实现兼容火狐、IE的LI奇偶行颜色交替方法。分享给大家供大家参考。具体如下：

这是一款兼容火狐、IE的LI颜色交替的方法，实则是平铺的背景，不过相对使用JS，平铺背景也不失为一种好方法，因为处理一个GIF图像也不是什么难办的事，最其码比使用JS的要兼容性好许多，你可以在不同的浏览器下试一下。

运行效果截图如下：

在线演示地址如下：

@L_406_0@

具体代码如下：

复制代码代码如下:!DOCTYPE htML PubLIC "-//W3C//DTD XHTML 1.0 TransITional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
html XMlns="http://www.w3.org/1999/xhtml">
head>
meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
title> CSS实现奇偶数行颜色交替方法/title>
style type="text/css">
-- * {
margin:0;
padding:0;
}
body {
background:#FFF;
font:12px Geneva, Arial, Helvetica, sans-serif #000;
line-height: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;
margin: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网页设计有所帮助。

声明：本文内容由网友自发贡献，本站不承担相应法律责任。对本内容有异议或投诉，请联系2913721942#qq.com核实处理，我们将尽快回复您，谢谢合作！