zoukankan      html  css  js  c++  java
  • dedecms列表页如何让文章列表里面的文章每隔五篇就隔开一段空间

    dedecms列表页如何让文章列表里面的文章每隔五篇就隔开一段空间,运用js控制列表样式的方法。

    代码如下:

    <script type="text/javascript">
    $(function(){
            var liList=document.getElementById("uls").getElementsByTagName("li");
            for(i=0;i<liList.length;i++)
            {
                if(i==4)
                {
                    liList[i].className="add_li";
                }
                if(i==9)
                {
                    liList[i].className="add_li";
                }
                if(i==14)
                {
                    liList[i].className="add_li";
                }
                if(i==19)
                {
                    liList[i].className="add_li";
                }
                if(i==24)
                {
                    liList[i].className="add_li";
                }
                
            }
    });
    </script>

    <div class="list1">
                  <ul id="uls">
                {dede:list pagesize='20'}
                     <li><div class="span"><a href="[field:arcurl/]">[field:title/]</a></div><div class="span1">[field:pubdate function="MyDate('Y-m-d',@me)"/]</div></li>
                     {/dede:list}
            </ul>
          </div>

    css样式代码:

    .main_01 .left .list1 li{float:left;644px; line-height:30px;font-size:14px; background:url(../images/dian.gif) left 2px no-repeat; padding-left:12px; border-bottom:1px  dashed #E7E7E7}
    .main_01 .left .list1 li a{ font-size:14px; text-align:left; float:left; 520px;}
    .main_01 .left .list1 .pagelist{float:left;606px; padding-left:24px; padding-right:24px; text-align:center; padding-bottom:15px;}
    .main_01 .left .list1 .add_li { margin-bottom:35px;}

    效果图如下:

  • 相关阅读:
    C语言函数手册—函数分类列表
    HTTP协议详解(一直在用可是这篇太好了转一下)
    Substance风格实例大全javaswing皮肤风格大全(原)
    Component creation must be done on Event Dispatch Thread错误解决方法
    用开源Look&Feel (Substance)写 漂亮的Swing应用程序
    Swift翻译之-关于Swift
    Swift翻译之-Swift语法入门 Swift语法介绍
    Swift语言简介+快速上手
    JDK各个版本的新特性jdk1.5-jdk8
    5个常用Java代码混淆器 助你保护你的代码
  • 原文地址:https://www.cnblogs.com/cbboys/p/3695943.html
Copyright © 2011-2022 走看看