基于divCSS下拉导航菜单分类代码是一款绿色风格的jQuery下拉分类导航菜单。效果图如下：
在线预览 源码下载
实现的代码。
html代码：
<divclass="hc_lnav jslist"><divclass="allbtn"><h2><ahref="#"><strong> </strong>全部商品分类<i> </i></a></h2><ulstyle="width:190px"class="jspop box"><liclass=a1><divclass=tx><ahref="#"><i> </i>各地名优茶</a></div><dl><dt>热门</dt><dd><ahref="#">西湖龙井</a><ahref="#">金骏眉</a><ahref="#">大红袍</a><ahref="#">铁观音</a></dd></dl><dl><dt>名茶</dt><dd><ahref="#">红茶</a><ahref="#">绿茶</a><ahref="#">乌龙茶</a><ahref="#">黑茶</a><ahref="#">白茶</a></dd></dl><divclass=pop><h3><ahref="#">各地名优茶</a></h3><dl><dl><dt>绿茶</dt><dd><aclass="ui-link"href="#">西湖龙井</a><aclass="ui-link"href="#">龙井</a><aclass="ui-link"href="#">黄山毛峰</a><aclass="ui-link"href="#">安吉白茶</a><aclass="ui-link"href="#">其他绿茶</a></dd></dl><dl><dt>乌龙茶</dt><dd><aclass="ui-link"href="">铁观音</a><aclass="ui-link"href="">大红袍</a><aclass="ui-link"href="">水仙</a><aclass="ui-link"href="">肉桂</a><aclass="ui-link"href="">台湾乌龙</a><aclass="ui-link"href="">其他乌龙茶</a></dd></dl><dl><dt>红茶</dt><dd><aclass="ui-link"href="">金骏眉</a><aclass="ui-link"href="">正山小种</a><aclass="ui-link"href="">祁门红茶</a><aclass="ui-link"href="">坦洋工夫</a><aclass="ui-link"href="javascript:;">其他红茶</a><aclass="un ui-link"href="">政和工夫</a><aclass="ui-link"href="">滇红工夫</a></dd></dl><dl><dt>黑茶</dt><dd><aclass="ui-link"href="">白沙溪黑茶</a><aclass="ui-link"href="">普洱茶饼</a><aclass="ui-link"href="">普洱沱茶</a><aclass="ui-link"href="">普洱茶砖</a><aclass="ui-link"href="">普洱散茶</a><aclass="ui-link"href="">其他黑茶</a></dd></dl><dl><dt>白茶</dt><dd><aclass="ui-link"href="#">白牡丹</a><aclass="ui-link"href="">白毫银针</a><aclass="ui-link"href="">寿眉</a><aclass="ui-link"href="">其他白茶</a></dd></dl></dl><dl><dt>品牌</dt><dd><ahref="">滋恩</a><ahref="">远荣</a><ahref="">顶峰</a><ahref="">公泰</a><ahref="">一品堂</a><ahref="">好吉</a><ahref="">绿雪芽</a><ahref="">台湾梅山制茶</a><ahref="">白沙溪</a><ahref="">联兴茶叶</a></dd></dl><dl><dt>价格</dt><dd><ahref="">100元及以下</a><ahref="">100-300元</a><ahref="">300元及以上</a></dd></dl><dl><dt>净含量</dt><dd><ahref="">50g及以下</a><ahref="">51-100g</a><ahref="">101-250g</a><ahref="">250g以上</a></dd></dl><dl><dt>包装</dt><dd><ahref="">经济自饮装</a><ahref="">精美礼品装</a></dd></dl><divclass=clr></div><divclass=act><ahref=""><imgsrc="images/20150518092317.jpg"/></a></div></div></li><liclass=a2><divclass=tx><ahref=""><i> </i>花草保健茶</a></div><dl><dt>推荐</dt><dd><ahref="">大麦茶</a><ahref="">苦荞茶</a><ahref="">玫瑰花茶</a><ahref="">雪菊</a><ahref="">蜂蜜木瓜粉</a></dd></dl><divclass=pop><h3><ahref="">花草保健茶</a></h3><dl><dl><dt>瘦身</dt><dd><aclass="ui-link"href="">玫瑰荷叶茶</a><aclass="ui-link"href="">玄米茶</a><aclass="ui-link"href="">兰香子</a><aclass="ui-link"href="">纤维泡腾片</a><aclass="ui-link"href="">青梅苹果酸</a><aclass="ui-link"href="">三草茶</a></dd></dl><dl><dt>美容</dt><dd><aclass="ui-link"href="">法兰西玫瑰</a><aclass="ui-link"href="">冻干柠檬片</a><aclass="un ui-link"href="">果粒茶</a><aclass="ui-link"href="">大麦茶</a><aclass="ui-link"href="">蜂蜜抹茶粉</a></dd></dl><dl><dt>丰胸</dt><dd><aclass="ui-link"href="">木瓜葛根粉</a><aclass="ui-link"href="">蜂蜜木瓜粉</a><aclass="ui-link"href="">红酒木瓜丽人饮</a></dd></dl></dl><dl><dt>品牌</dt><dd><ahref="">与花香</a><ahref="">美丽快攻</a><ahref="">顶峰</a></dd></dl><dl><dt>价格</dt><dd><ahref="">100元及以下</a><ahref="">100-300元</a><ahref="">300元及以上</a></dd></dl><dl><dt>净含量</dt><dd><ahref="">50g及以下</a><ahref="">51-100g</a><ahref="">101-250g</a><ahref="">250g以上</a></dd></dl><dl><dt>包装</dt><dd><ahref="">经济自饮装</a><ahref="">精美礼品装</a></dd></dl><divclass=clr></div><divclass=act><ahref=""><imgsrc="images/20150518092236.jpg"/></a></div></div></li><liclass=a3><divclass=tx><ahref=""><i> </i>精选茶具</a></div><dl><dt>推荐</dt><dd><ahref="">功夫茶具</a><ahref="">个人杯</a><ahref="">茶宠</a><ahref="">茶叶罐</a></dd></dl><divclass=pop><h3><ahref="">精选茶具</a></h3><dl><dl><dt>陶瓷</dt><dd><aclass="ui-link"href="">茶叶罐</a><aclass="ui-link"href="">功夫茶具</a><aclass="ui-link"href="">茶壶</a><aclass="ui-link"href="">茶宠</a><aclass="ui-link"href="">茶杯</a><aclass="ui-link"href="">茶具礼盒</a></dd></dl></dl><dl><dt>品牌</dt><dd><ahref="">恒越</a><ahref="">卓越</a><ahref="">国尊陶瓷</a><ahref="">宏远达</a><ahref="">福万利</a></dd></dl><dl><dt>价格</dt><dd><ahref="">100元及以下</a><ahref="">100-300元</a><ahref="">300元及以上</a></dd></dl><dl><dt>包装</dt><dd><ahref="">经济自饮装</a><ahref="">精美礼品装</a></dd></dl><divclass=clr></div><divclass=act><ahref=""><imgsrc="images/20150518092152.jpg"/></a></div></div></li><liclass=a4><divclass=tx><ahref=""><i> </i>可口茶食</a></div><dl><dt>推荐</dt><dd><ahref="">橄榄</a><ahref="">冰糖杨梅</a><ahref="">酸甜梅</a></dd></dl><divclass=pop><h3><ahref="">可口茶食</a></h3><dl><dl><dt>干果</dt><dd><aclass="ui-link"href="">杏仁</a><aclass="ui-link"href="">瓜子</a><aclass="un ui-link"href="">开心果</a></dd></dl><dl><dt>零食</dt><dd><aclass="ui-link"href="">水晶柠檬片</a><aclass="ui-link"href="">方块酥</a><aclass="ui-link"href="Javascript:;">凤梨酥</a><aclass="ui-link"href="">燕麦巧克力</a></dd></dl></dl><dl><dt>品牌</dt><dd><ahref="">赛园</a><ahref="">新味</a></dd></dl><dl><dt>价格</dt><dd><ahref="">100元及以下</a><ahref="">100-300元</a><ahref="">300元及以上</a></dd></dl><dl><dt>净含量</dt><dd><ahref="">50g及以下</a><ahref="">51-100g</a><ahref="">101-250g</a><ahref="">250g以上</a></dd></dl><dl><dt>包装</dt><dd><ahref="">经济自饮装</a><ahref="">精美礼品装</a></dd></dl><divclass=clr></div><divclass=act><ahref=""><imgsrc="images/20150518092213.jpg"/></a></div></div></li></ul></div></div>
via:http://www.w2bc.com/article/58756