怎么是你

关注互联网,关注搜索,关注信息技术对现代生活方方面面的影响

« else if与elseif的区别画圈 »

动态网页背景样式间隔的效果

        在静态网页中要使列表背景呈现间隔显示效果很容易实现,最简单最笨的方法就是给不同行设置不同的样式,但如何在动态网页中实现这样的效果呢?这种方法可以方便的实现,并且在IE及FF下都没有问题:

CSS:

.li01 { background:#fff; }
.li02 { background:#B1C4D1; }

HTML:

<ul class="list"  id="list01">
          <li><span class="date">日期</span> <a href="#">培训一</a> </li>
          <li><span class="date">日期</span><a href="#">培训二</a></li>
          <li><span class="date">日期</span><a href="#">培训三</a></li>
          <li><span class="date">日期</span><a href="#">培训四</a></li>
          <li><span class="date">日期</span><a href="#">培训五</a></li>
          <li><span class="date">日期</span><a href="#">培训六</a></li>
       </ul>
       
        <script Language="Javascript1.2">
objName=document.getElementById("list01").getElementsByTagName("li")
for (i=0;i<objName.length;i++) {
(i%2==0)?(objName(i).className = "li01"):(objName(i).className = "li02");
}
</script>

  • 相关文章:

发表评论:

◎欢迎参与讨论,请在这里发表您的看法、交流您的观点。

网站分类

最近发表

最新评论及回复

文章归档

Search

Powered By Z-Blog 1.8 Spirit Build 80722 Designed by Han'space

桂ICP备06007671号Copyright building. Some Rights Reserved.