ecshop 二次开发之三级商品分类树

来源：互联网发布：汕头公共汽车app软件编辑：程序博客网时间：2024/04/30 11:53
项目需求如下，遍历三级商品分类树，二级和三级同属一个DIV，商品分类树尼玛老生常谈的问题了，于是在category_tree.lbi实现代码如下：
<span style="font-family:Microsoft YaHei;font-size:14px;"><meta http-equiv="Content-Type" content="text/html; charset=utf-8"><style type="text/css"><!--.my_left_category2{display:block; float:left; width:196px; font-size:12px; height:144px; _height:148px; padding-top:0px; border:2px #676767 solid; border-top:none;}.my_left_category2 dt{height:33px; line-height:33px; background:url(images/category_bg.jpg) no-repeat; border-bottom:#CCC 1px solid; margin:0 5px 0 5px;}.my_left_category2 dt .a1{font-size:14px; width:135px; margin-left:2px; padding-left:23px; display:block;height:30px;line-height:30px;float:left;  font-weight:bolder ; color:#333333;}.my_left_category2 .category_over .a1{font-size:14px; font-weight:bold; color:#333; border:1px solid #4b941e; border-right:none;}.my_left_category2 .category_over .a1:hover{color:#1b578a}.category_over_box{display:none; margin-top:20px; _margin-top:0px; *margin-top:0px; margin-top:0px9;}.category_over_box .f_l{width:53px; text-align: right; padding-right:7px; float:left; font-weight:bold; color:#cc0000}.category_over_box .f_l a{padding:0 6px; white-space:nowrap; color:#cc0000}.category_over_box .f_r{width:420px; float:left; text-align:left; line-height:18px; color:#CCCCCC}.category_over_box .f_r b{font-weight:normal; height:18px; line-height:18px; float:left;}.category_over .category_over_box{display:block; background:#FFF ; border:1px solid #4b941e; width:506px; position:absolute; margin-left:160px; *margin-left:-4px; _margin-left:-4px; margin-top:0px; z-index:998}.category_over_box ul{padding:0 10px;}.category_over_box ul li{border-bottom:1px solid #ffefdd7; line-height:21px; height:auto; padding:6px 0}.dang{display:none; margin-top:1px; margin-left:-2px;}.category_over .dang{display:block}--></style><div style="width:200px; float:left; padding-bottom:10px;"><div class="module" style=" padding:0px; margin:0px;">    <div class="caption" style="background:url(images/category_title_bg.jpg) no-repeat; width:200px; height:38px; line-height:36px; overflow:hidden; float:left">      <font style="float:left; color:#FFF;">商品分类</font>    </div>    <div class="my_left_category2">                  <!--{foreach from=$categories item=cat}-->      <dt onmouseover="this.className='category_over'" onmouseout="this.className=''" class="">              <a class="a1"  href="{$cat.url}">{$cat.name|escape:html}</a>               <div class="category_over_box">                 <ul class="clearfix">    <!--{foreach from=$cat.cat_id item=child}-->                                <li>                  <div style="clear:both"></div>                  <div class="f_l"> <a class="over_2" href="{$child.url}">{$child.name|escape:html}</a></div>                     <div class="f_r"><!--{foreach from=$child.cat_id item=childer}-->                                        <b> | <a class="over_3" href="{$childer.url}">{$childer.name|escape:html}</a> </b>                                     <!--{/foreach}-->                                      </div>                        <div style="clear:both"></div>                </li>   <!--{/foreach}-->            </ul>          </div>          <img class="dang" style="position: relative; float:left" src="images/dang.gif">        </dt>                <!--{/foreach}--> </div></div></div></span>
实现效果如下：
0 0