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

    效果图如下:

     
    清风明月本无价,近水远山皆有情。
  • 相关阅读:
    Docker 安装各种环境
    N级树形菜单封装
    一个周期算出所有高电平的个数
    DDR3新版(3):DDR3自动读写控制器
    DDR3_新版(2):IP核再封装
    数电(6):时序逻辑电路
    Vue表单那些事
    liunx环境修改minio默认端口和后台启动
    liunx 后台启动mongodb服务
    liunx安装和部署nacos配置中心
  • 原文地址:https://www.cnblogs.com/onlylove2015/p/4392167.html
Copyright © 2011-2022 走看看