EC2.61版本商品分类两列的完美设置!

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

第一步,打开\themes\default\style.css文件,找到如下代码:

下面是原代码:
/*商品分类*/
#category_tree{border:4px solid #f1faff; background-color:#fff;}
#category_tree dl{margin:6px;}
#category_tree dt{background:url(images/lineBg.gif) repeat-x left bottom;
color:#3f3f3f;padding:2px 0 3px 12px;
}
#category_tree dt a{background:url(images/bg.gif) no-repeat 0 -69px;
color:#3f3f3f; padding-left:15px; text-decoration:none;
}
#category_tree dd{padding:3px 0 3px 10px;}
#category_tree dd a{color:#404040; text-decoration:none;}
#category_tree dd a:hover{color:#ff6600; text-decoration:none;}
/*销售排行*/

现在下面的是修改后的代码:

/*商品分类*/
#category_tree{border:4px solid #ffeef6; background-color:#fff;}
#category_tree dl{margin:6px;}
#category_tree dt{background:url(images/lineBg.gif) repeat-x left bottom;
color:#3f3f3f;padding:2px 0 3px 12px; width:150px;
}
#category_tree dt a{background:url(images/bg.gif) no-repeat 0 -69px;
color:#3f3f3f; padding-left:15px; text-decoration:none;
}
#category_tree dd{padding:3px 0 3px 10px; width:70px; float:left;
white-space:nowrap;
word-break:keep-all;
display: inline;
}
#category_tree dd a{color:#404040; text-decoration:none;}
#category_tree dd a:hover{color:#ff6600; text-decoration:none;}
/*销售排行*/

上面改完,基本两列可以正常使用了,在分来最下面很不美观,接下来,我们在进行修改!

打开文件\themes\default\library\category_tree.lbi

增加一行看代码红色就是增加部分!

<meta http-equiv="Content-Type" content="text/html; charset=gbk">
<div class="box">
<div class="box_1">
<div id="category_tree">
<!--{foreach from=$categories item=cat}-->
<dl>
<dt><a href="{$cat.url}">{$cat.name|escape:html}</a></dt>
<!--{foreach from=$cat.children item=child}-->
<dd><a href="{$child.url}">{$child.name|escape:html}</a></dd>
<!--{/foreach}-->
</dl>
<!--{/foreach}-->
<DL><DT><div align="center"> </div></DT></DL>
</div>
</div>
</div>
<div class="blank5"></div>

大家还可以在<div alige="center">这里加上你要加的文字</div>,不加也可以!

第一次用EC,第一个改进的地方,望大侠们别见笑了!谢谢大家,不懂留言,我想上面是非常清楚的!

回答：
看看你的演示地址

谢谢分享！
成功了。。。忠心感谢！


谢谢楼上,有人成功就可以了

已经成功了,谢谢楼主哦....

不错是不错
好象会改变颜色
变成粉红的了

这是好多人在关注的东西

收藏了...

期待修改个真正完美的，现在就等这部分了

最重要的是

padding:3px 0 3px 10px; width:70px; float:left;
white-space:nowrap;
word-break:keep-all;
display: inline;

我的怎么商品错位了我是U-8编码的

好东西！！！
粉红的话，把第一行原来的

/*商品分类*/
#category_tree{border:4px solid #f1faff; background-color:#fff;}——————此行不变
#category_tree dl{margin:6px;}
#category_tree dt{background:url(images/lineBg.gif) repeat-x left bottom;
color:#3f3f3f;padding:2px 0 3px 12px;
}
#category_tree dt a{background:url(images/bg.gif) no-repeat 0 -69px;
color:#3f3f3f; padding-left:15px; text-decoration:none;
}
#category_tree dd{padding:3px 0 3px 10px;}
#category_tree dd a{color:#404040; text-decoration:none;}
#category_tree dd a:hover{color:#ff6600; text-decoration:none;}
/*销售排行*/

非常喜欢

路过，收藏，谢谢