destoon 5.0模板使用之：分类属性的美化和筛选条件设置

2385656146

发现其他的商城都有这个功能，而destoon却没有，所以也加上这个功能。经过美化就做成了以下的效果。但却是按循序排列的，但是不影响使用。

源代码
html
   
        
            
            portant;">
            {if $CP}
            div class="filter_box">
              dl>
                dt class="filter_t">分类：dt>
            
                dd class="{if !$catid==$catid}seling_all{else}seled_all{/if}">a href="{$MODULE[16][linkurl]}">全部a>dd>
            
                dd class="filter_choose">
                  {php $sub = get_maincat(0, 16, 1);}
                  {loop $sub $j $s}
                  div class="{if $s[catid]==$catid}seling{else}seled{/if}">
                    a href="{$MODULE[16][linkurl]}{$s[linkurl]}">{$s[catname]}a>
            
                  div>
            
                  {/loop}
                dd>
            
                div class="clear">div>
            
              dl>
            
              {loop $PPT $p}
              dl>
                dt class="filter_t">{$p[name]}：dt>
            
                input type="hidden" name="ppt_{$p[oid]}" id="ppt_{$p[oid]}" value="{$p[select]}"/>
                dd class="{if $p[select]==''}seling_all{else}seled_all{/if}">
                  a href="###" onclick="Dd('ppt_{$p[oid]}').value='';Dd('fsearch').submit();">全部a>
            
                dd>
            
                dd class="filter_choose">
                {loop $p[options] $o}
                  div class="{if $p[select]==$o}seling{else}seled{/if}">
                    a href="###" onclick="Dd('ppt_{$p[oid]}').value='{$o}';Dd('fsearch').submit();">{$o}a>
            
                  div>
            
                {/loop}
                dd>
            
                div class="clear">div>
            
              dl>
            
              {/loop}
            div>
            
            div class="search_title">
              div class="spanbt">共有span class="orange">{$items}span>条信息div>
            
              span class="fl">已选条件：span>
            
              ul class="fl">
                {loop $PPT $p}{loop $p[options] $o}{if $p[select]==$o}
                li class="search_value">span>{$o}span>
            
                  label class="search_value_close" onclick="Dd('ppt_{$p[oid]}').value='';Dd('fsearch').submit();">label>
            
                li>
            
                {/if}{/loop}{/loop}
              ul>
            
              a href="{$MOD[linkurl]}search.php" id="Del_searchList" style="">清空所有条件a>
            
            div>
            
            {/if}
            
                        
        
   
CSS
   
        
            
            portant;">
            .filter_box { width:auto; height:auto; }
            .filter_box a { cursor:pointer; }
            .filter_box dl { width:100%; height:auto; }
            .filter_t  { width:60px; float:left; display:block; line-height:28px; height:30px; text-align:right; font-size:14px; font-weight:bold; font-family: "Microsoft YaHei", monospace !important; }
            .filter_box dd { margin:8px 0px 0px 10px; float:left; display:block; }
            .filter_choose { width:620px; display:block; }
            .seling_all a { width:30px; padding-left:18px; line-height:14px; float:left; display:block; background:#70943c url(images/sel-select2.jpg) no-repeat; text-decoration:none; color:white; }
            .seling_all a:link, .seling_all a:visited, .seling_all a:active { color:white; }
            .seled_all a { width:30px; padding-left:18px; line-height:14px; float:left; display:block; background:#f3f3f3 url(images/sel-select1.jpg) no-repeat; text-decoration:none; }
            .seling a { float:left; line-height:14px; margin:0px 18px 10px 0px; padding-left:18px; background:#70943c url(images/sel-select2.jpg) no-repeat; text-decoration:none; color:white; }
            .seling { width: 122px; float: left; }
            .seling a:visited { color:white; }
            .seled a { width: 98px; line-height: 14px; margin: 0px 8px 10px 0px; padding-left: 18px; float: left; background:url(images/sel-select1.jpg) no-repeat; }
            .search_title{font-family: "Microsoft YaHei";font-size: 14px;}
            .search_title .spanbt { float: left; padding: 0 10px; }
            .search_value { margin-top: 5px; height: 15px; line-height: 15px; float: left; border: 1px solid #FFA63C; margin-right: 10px; display: inline; white-space: nowrap; }
            .search_value span { float: left; padding: 0 4px; height: 15px; line-height: 15px; overflow: hidden; }
            .search_value_close { width: 16px; height: 15px; background: url(images/search_select.gif) no-repeat; cursor: pointer; float: left; }
            
            
        
   
图片素材
鼠标右键保存，在重新命名，放到风格文件夹的 images 目录下。
search_select.gif


sel-select1.jpg


sel-select2.jpg



关键词：
destoon模板
destoon分类属性
destoon二次开发