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++之文件IO操作流”
    编译过程的一些小知识——#pragma once与 #ifndef的区别以及介绍
    编译过程的一些小知识——内部连接与外部连接
    VC MFC如何使用Console输出调试信息..
    windows 下ping命令,t选项
    电力间隔定义
    这样的要求不过分
    拾零之 :if 判断顺序的问题
    CMarkup 解析XML
    XinZhou housing mobile phone
  • 原文地址:https://www.cnblogs.com/onlylove2015/p/4392167.html
Copyright © 2011-2022 走看看