网页设计制作CSS实现隔行换色两种方法

网页设计制作,CSS实现隔行换色两种方法:

第一种方法:

style type="text/css"
UL.myul1 LI{background-color: expression(this.sourceIndex%2==0？'#9FB7F6':'#B6C8F8');
}
/style
ul class="myul1"
li id="li1"111/li
li id="li2"222/li
li id="li2"333/li
li id="li2"444/li
li id="li2"555/li
li id="li2"666/li
/ul

第二种方法:

style type="text/css"
!--
.li01 { background:#FFF; }
.li02 { background:#000; }
li a{width:100%;display:block;}
li a:hover{background:red;}
--
/style

div id="list01"ul
li class="title"a href="#"title/a/li
lia href="#"111/a/li
lia href="#"222/a/li
lia href="#"333/a/li
lia href="#"444/a/li
lia href="#"555/a/li
lia href="#"666/a/li
/ul/div

script Language="Javascript1.2"

objName=document.getElementById("list01").getElementsByTagName("li")

for (i=0;iobjName.length;i++) {
(i%2==0)？(objName(i).className = "li01"):(objName(i).className = "li02");
}
/script