DIV+CSS京东商城产品分类适合所有版本.doc

DIV+CSS京东商城产品分类适合所有版本 第一步：在你所用的模板的css文件中加上以下代码 Copy to clipboardView Code CSS101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110 .my_left_categorywidth211px;font-size12px; .my_left_category h1background-imageurl(imagesspring_06.jpg);height20px;background-repeatno-repeat;font-size14px;font-weightbold;padding-left15px;padding-top8px;margin0px;color#FFF;.my_left_category .my_left_cat_listwidth209px;border-color#ce2020;border-stylesolid;border-width0px 1px 1px 1px;line-height13.5pt;.my_left_category .my_left_cat_list h2 margin0px;padding3px 5px 0px 9px;.my_left_category .my_left_cat_list h2 acolor#d6290b;font-weightbold;font-size14px;line-height22px;.my_left_category .h2_catwidth209px;height26px;background-imageurl(imagesmy_menubg.gif);background-repeatno-repeat;line-height26px;font-weightnormal;color#333333;positionrelative;.my_left_category afont12px;text-decorationnone;color#333333;.my_left_category ahovertext-decorationunderline;color#ff3333;.my_left_category h3margin0px;padding0px;height26px;font-size12px;font-weightnormal;displayblock;padding-left8px;.my_left_category h3 spancolor#999999; width145px; floatright;.my_left_category h3 a line-height26px;.my_left_category .h3_catdisplaynone;width204px;positionabsolute;left184px;margin-top-26px;cursorauto;.my_left_category .shadowpositioninherit;backgroundurl(imagesshadow_04.gif) left top;width204px;.my_left_category .shadow_borderpositioninherit;width200px;border1px solid #959595; margin-top1px;border-left-width0px;backgroundurl(imagesshadow_border.gif) no-repeat 0px 21px;background-color#ffffff;margin-bottom3px.my_left_category .shadow_border ulmargin0; padding0; margin-left15px.my_left_category .shadow_border ul li list-stylenone;padding-left10px;background-imageurl(imagesmy_cat_sub_menu_dot.gif);background-repeatno-repeat;background-position0px 8px;floatleft;width75px;height26px;overflowhidden;.my_left_category .active_cat z-index99;background-position0 -25px;cursorpointer;.my_left_category .active_cat h3 font-weightbold.my_left_category .active_cat h3 span displaynone;.my_left_category .active_cat divdisplayblock; 第二步：模板文件夹的 librarycategory_tree.lbi内容改为： Copy to clipboardView Code HTML10111213141516171819202122232425262728293031323334353637383940414243444546 meta http-equiv=Content-Type content=texthtml; charset=gbkdiv class=my_left_categoryh1商品分类h1div class=my_left_cat_listassign var=pre_item_level value=-1!-foreach from=cat_list(0,0,false,3,false) item=cat-if $cat.level lt 2 & $pre_item_level gt 0divdiv ifif $cat.level eq 0h2a href=$cat.url$escapehtmlah2 elseif $cat.level eq 1div class=h2_cat onmouseover=this.className=h2_cat active_cat onmouseout=this.className=h2_cath3span - $cat.cat_descescapehtmlspana href=$cat.url$escapehtmlah3div class=h3_catdiv class=shadowdiv class=shadow_borderulelseif $cat.level eq 2lia href=$cat.url$escapehtmlali ifassign var=pre_item_level value=$cat.level!-foreach-if $pre_item_level gt 0uldivdivdivdiv if meta 第三步：把用到的图片拷贝到模板文件夹的images目录完成！注：京东的二级分类名称旁边列了2个三级分类名称（灰色）,作为三级分类的提示。参考其他网友的做法，这里使用二级类的描述字段cat_desc来实现,【用程序去调取二级类下的前两个三级分类完全是化简为烦的事情。】但这个效果要修改 includeslib_common.php 才生效的，当然，不修改也不会出错，只是没有显示罢了。修改方法：在includeslib_common.php 的cat_list函数中找到$sql =