请问各位高手 这样的分类如何实现？

2016-07-07 16:06 来源：www.chinab4c.com 作者：ecshop专家

我用的是BLUEOCEAN模板 现在论坛上 关于分类树种类的帖子很少希望高手能费心解答一下
想实现如下效果 附件.jpg <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<div class="area" id="category_tree">
<div class="top"><span></span></div>
<div class="content">
<h1>Categories</h1>
<dl>
<!--{foreach from=$categories item=cat}-->
<dt><font class="f1"></font><a href="{$cat.url}">{$cat.name|escape:html}</a></dt>
<dd>
<!--{foreach from=$cat.cat_id item=child}-->
<a href="{$child.url}">{$child.name|escape:html}</a>
<!--{/foreach}-->
</dd>
<!--{/foreach}-->
</dl>
</div>
<div class="bottom"><span></span></div>
</div>



这个是我的库文件

/*----- category_tree -----*/
#category_tree .top{height:8px; overflow:hidden; background:url(images/bg.gif) no-repeat 0px 0px;}
#category_tree .top span{ height:8px; width:8px; display:block; float:right; background:url(images/category_tree.jpg) no-repeat right top;}
#category_tree .content{ border-right:3px #185ec4 solid; padding:0 5px; border-left:3px #185ec4 solid;}
#category_tree h1{ font-size:16px; line-height:18px; margin-bottom:5px; color:#1354bf;}
#category_tree dt{ font-size:12px; color:#8d8d8d; line-height:16px;}
#category_tree dt a{color:#8d8d8d;}
#category_tree dd{padding:0 10px; font-size:12px; line-height:16px; color:#1354bf;}
#category_tree dd a:hover{color:#8d8d8d;}
#category_tree dd a{font-size:12px; display:block; color:#1354bf; padding-left:5px; background:url(images/bg.gif) no-repeat -751px -513px;}
#category_tree .bottom{height:8px; overflow:hidden; font-size:1px; background:url(images/bg.gif) no-repeat 0px -24px;}
#category_tree .bottom span{height:8px; width:8px; float:right; background:url(images/category_tree2.jpg) no-repeat right top;}
以上是样式表里 分类树的内容

请各位高手不要吝啬谢谢了

回答：
学习了！～

不是啊 我想实现这个效果确做不好 哪位高手 指点下思路

ec可以做出这种功能的吧。 帮顶。

帮顶一下