最新公告
  • 欢迎您光临仿站吧 帝国CMS模板一站式建站供应平台 . 欢迎加入VIP
  • 织梦CMS给文章列表加序号

    正文概述 仿站吧   2021-12-20 00:41:07  

    给文章列表加序号,效果图如下:

    第一:

    织梦CMS给文章列表加序号 第1张

    css代码部分 

    1. <style type="text/css"> 
    2. <!-- 
    3. .downtop { 
    4. FLOAT: left; OVERFLOW: hidden; WIDTH: 218px; HEIGHT: 278px 
    5. .downtop UL.text { 
    6. MARGIN: 0px 10px; WIDTH: 198px; PADDING-TOP: 5px 
    7. .downtop UL.text LI { 
    8. WIDTH: 198px 
    9. .downtop UL.text SPAN { 
    10. DISPLAY: block; FLOAT: left 
    11. .downtop UL.text SPAN.num { 
    12. MARGIN-TOP: 4px; PADDING-LEFT: 1px; FONT-WEIGHT: bold; FONT-SIZE: 10px; WIDTH: 18px; LINE-HEIGHT: 12px; HEIGHT: 13px; TEXT-ALIGN: center;COLOR: #fff; BACKGROUND-COLOR: #b7b7b7 
    13. .downtop UL.text LI SPAN.active { 
    14. BACKGROUND-COLOR: #7abdff 
    15. .downtop UL.text SPAN.tit { 
    16. PADDING-LEFT: 10px; OVERFLOW: hidden; WIDTH: 168px; WHITE-SPACE: nowrap; HEIGHT: 21px 
    17. --> 
    18. </style> 
    dede标签部分代码 
    1. <DIV class="downtop border"> 
    2. <UL class=text> 
    3. {dede:arclist orderby=pubdate type='commend.' titlelen='26' row='10' channel=3} 
    4. <LI>
    5. [field:global runphp='yes' name=autoindex] 
    6. $a="<SPAN>"; 
    7. $b="</SPAN>"; 
    8. $c="<SPAN>"; 
    9. if (@me > 3) @me = $c.@me.$b; 
    10. else @me = $a.@me.$b; 
    11. [/field:global] 
    12. <SPAN class=tit><A title="[field:title/]" 
    13. href="[field:filename/]">[field:title/]</A></SPAN></LI> 
    14. {/dede:arclist} 
    15. </UL> 
    16. </DIV> 

    第二:

    网站制作过程中经常会遇到在文章列表里面加数字序号的情况(如下图)

                    织梦CMS给文章列表加序号 第2张


    可以通过织梦自带的autoindex属性来实现。

    1. {dede:arclist row='5' titlelen='30' }<li><em>[field:global.autoindex][/field:global]</em><ahref='[field:arcurl/]'title="[field:fulltitle/]">[field:title/]</a><cite>[field:pubdate function="MyDate('m-d',@me)"/]</cite></li>{/dede:arclist}

    有时候使用{dede:channelartlist}标签的时候用autoindex属性是没办法实现的。需要用{dede:global name='itemindex'/}来代替。

    第三:

    dede文章列表加上序号效果

    css代码部分

    1. <style type="text/css">
    2. <!--
    3. .downtop {
    4. FLOAT: left; OVERFLOW: hidden; WIDTH: 218px; HEIGHT: 278px
    5. }
    6. .downtop UL.text {
    7. MARGIN: 0px 10px; WIDTH: 198px; PADDING-TOP: 5px
    8. }
    9. .downtop UL.text LI {
    10. WIDTH: 198px
    11. }
    12. .downtop UL.text SPAN {
    13. DISPLAY: block; FLOAT: left
    14. }
    15. .downtop UL.text SPAN.num {
    16. MARGIN-TOP: 4px; PADDING-LEFT: 1px; FONT-WEIGHT: bold; FONT-SIZE: 10px; WIDTH: 18px; LINE-HEIGHT: 12px; HEIGHT: 13px; TEXT-ALIGN: center;COLOR: #fff; BACKGROUND-COLOR: #b7b7b7
    17. }
    18. .downtop UL.text LI SPAN.active {
    19. BACKGROUND-COLOR: #7abdff
    20. }
    21. .downtop UL.text SPAN.tit {
    22. PADDING-LEFT: 10px; OVERFLOW: hidden; WIDTH: 168px; WHITE-SPACE: nowrap; HEIGHT: 21px
    23. }
    24. -->
    25. </style>

    dede标签部分代码

    1. <DIV class="downtop border">
    2. <UL class=text>
    3. {dede:arclist orderby=pubdate type='commend.' titlelen='26' row='10' channel=3}
    4. <LI>[field:global runphp='yes' name=autoindex]
    5. $a="<SPAN class='num active'>";
    6. $b="</SPAN>";
    7. $c="<SPAN class='num'>";
    8. if (@me > 3) @me = $c.@me.$b;
    9. else @me = $a.@me.$b;
    10. [/field:global] <SPAN class=tit><A title="[field:title/]"
    11. href="[field:filename/]">[field:title/]</A></SPAN></LI>
    12. {/dede:arclist}
    13. </UL>
    14. </DIV>
    效果图:

    织梦CMS给文章列表加序号 第3张

     

    仿站吧,一个优质的源码资源平台!
    仿站吧 » 织梦CMS给文章列表加序号