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;}

    效果图如下:

     
    清风明月本无价,近水远山皆有情。
  • 相关阅读:
    5 构建Mysql+heartbeat+DRBD+LVS集群应用系统系列之生产环境下drbd裂脑处理
    elk系列8之logstash+redis+es的架构来收集apache的日志
    elk系列7之通过grok分析apache日志
    elk系列6之tcp模块的使用
    elk系列5之syslog的模块使用
    elk系列4之kibana图形化操作
    elk系列3之通过json格式采集Nginx日志
    elk系列2之multiline模块的使用
    Docker探索系列2之镜像打包与DockerFile
    elk系列1之入门安装与基本操作
  • 原文地址:https://www.cnblogs.com/onlylove2015/p/4392167.html
Copyright © 2011-2022 走看看