有一种朋友不在生活里，却在生命力；有一种陪伴不在身边，却在心间。图老师即在大家的生活中又在身边。这么贴心的服务你感受到了吗？话不多说下面就和大家分享网页设计制作CSS实现隔行换色两种方法吧。
【 tulaoshi.com - Web开发 】
网页设计制作,CSS实现隔行换色两种方法:
（本文来源于图老师网站，更多请访问https://www.tulaoshi.com/webkaifa/）第一种方法:
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
来源:https://www.tulaoshi.com/n/20160219/1629684.html
看过《网页设计制作CSS实现隔行换色两种方法》的人还看了以下文章 更多>>
