导航

<style>
.userNav{ width:1920px; height:40px;}
.userNav:after{ content:"";clear:both;visibility:hidden;display:block; }
.userMain a{text-decoration:none; color:#0f0f0f;}
.userLeft,.userRight,.userMain{ float:left;}
.userMain{ margin:0; padding:0;}
.userMain li{ float:left; height:40px;list-style:none;}
.userAll{ position:relative; height:40px}

.userDrap{ width:1101px; border:1px solid #ccc; height:376px; position:absolute; top:40px; left:0; padding-left:67px; padding-right:40px; display:none}
.userDrapLeft{ width:55%; float:left;}
.userDrapRight{ width:45%; float:left;}
.userDrapLeft dl{ width:70px; float:left; margin-right:81px;padding:0;}
.userDrapLeft dl dt{ font-size:16px; font-weight:800; line-height:24px; margin-top:50px; margin-bottom:12px;}
.userDrapLeft dl dd{ line-height:38px; height:38px; margin:0; padding:0; }
.userDrapLeft dl dd i{ background:url(http://img10.360buyimg.com/imgzone/jfs/t17224/149/2250466881/1485/52be6e6/5aec319bN091e93f6.jpg) no-repeat 5px; width:17px; height:13px; float:left;}
.userDrapLeft dl dd a{ font-size:13px; color:#393939; float:left;}
.userDrapLeft dl dd em{ float:right;}
.userDrapRight{ margin-top:40px}
.userDrapRight div{ float:left}
.userrightThr,.userrightFour{ margin-top:36px}
.userrightOne,.userrightThr{ margin-right:30px;}
.userMain .userAll:hover .userDrap{ display:block}

.userLiving,.userRoom,.userRestaurant,.userDesk,.userStore{ position:relative}
.userLiving dl{ position:absolute; top:40px; left:9px; padding:5px; background-color:#efefef; width:80px; display:none; margin:0; padding:0; }
.userLiving dl dd{ line-height:30px; text-align:center; font-size:13px; border-bottom:1px dashed #ccc; width:60px; margin:0 auto; margin:0; padding:0; }
.userLiving dl .userlastBord,
.userRoom dl .userlastBord,
.userRestaurant dl .userlastBord,
.userDesk dl .userlastBord,
.userStore dl .userlastBord
{ border-bottom:none}
.userLiving:hover dl,.userRoom:hover dl,.userRestaurant:hover dl,.userDesk:hover dl,.userStore:hover dl{ display:block}

.userRoom dl{ position:absolute; top:40px; left:-7px; padding:5px; background-color:#efefef; width:80px; display:none; margin:0; padding:0; }
.userRoom dl dd{ line-height:30px; text-align:center; font-size:13px; border-bottom:1px dashed #ccc; width:60px; margin:0 auto;}

.userRestaurant dl{position:absolute; top:40px; left:-7px; padding:5px; background-color:#efefef; width:80px;display:none; margin:0; padding:0; }
.userRestaurant dl dd{ line-height:30px; text-align:center; font-size:13px; border-bottom:1px dashed #ccc; width:60px; margin:0 auto; padding:0; }

.userDesk dl{position:absolute; top:40px; left:-7px; padding:5px; background-color:#efefef; width:80px;display:none; margin:0; padding:0; }
.userDesk dl dd{ line-height:30px; text-align:center; font-size:13px; border-bottom:1px dashed #ccc; width:60px; margin:0 auto; padding:0; }

.userStore dl{ position:absolute; top:40px; left:9px; padding:5px; background-color:#efefef; width:90px;display:none; margin:0; padding:0; }
.userStore dl dd{ line-height:30px; text-align:center; font-size:13px; border-bottom:1px dashed #ccc; width:65px; margin:0 auto; padding:0; }


</style>
<div class="userNav">
<div class="userLeft">
<img src="http://img10.360buyimg.com/imgzone/jfs/t20005/356/234151653/2749/e42c46f4/5aec20b1Nda8e5b2d.jpg" width="369" height="40">
</div>
<ul class="userMain">
<li class="userAll">
<a href="https://mall.jd.com/advance_search-629101-598698-590193-0-0-0-1-1-60.html?keyword=%25E6%2582%25A0%25E8%25B4%25A8%25E5%25AE%25B6" target="_blank"><img src="http://img10.360buyimg.com/imgzone/jfs/t17524/92/2178082017/2840/3c6c59d5/5aec20b1N43a600cd.jpg" width="149" height="40"></a>
<!--所有产品-->
<div class="userDrap">
<div class="userDrapLeft">
<dl>
<dt><a href="#" target="_blank">客厅系列</a></dt>
<dd><a href="#" target="_blank">沙发</a><em>&gt;</em><i></i></dd>
<dd><a href="#" target="_blank">茶几</a><em>&gt;</em></dd>
<dd><a href="#" target="_blank">电视柜</a><em>&gt;</em></dd>
<dd><a href="#" target="_blank">间厅柜</a><em>&gt;</em></dd>
<dd><a href="#" target="_blank">花架</a><em>&gt;</em></dd>
<dd><a href="#" target="_blank">厅柜酒柜</a><em>&gt;</em></dd>
</dl>
<dl>
<dt><a href="#" target="_blank">卧室系列</a></dt>
<dd><a href="#" target="_blank">实木床</a><em>&gt;</em><i></i></dd>
<dd><a href="#" target="_blank">床头柜</a><em>&gt;</em></dd>
<dd><a href="#" target="_blank">衣柜</a><em>&gt;</em></dd>
<dd><a href="#" target="_blank">床垫</a><em>&gt;</em></dd>
<dd><a href="#" target="_blank">储物柜</a><em>&gt;</em></dd>
<dd><a href="#" target="_blank">梳妆台</a><em>&gt;</em></dd>
</dl>
<dl>
<dt><a href="#" target="_blank">餐厅系列</a></dt>
<dd><a href="#" target="_blank">餐桌</a><em>&gt;</em></dd>
<dd><a href="#" target="_blank">餐椅</a><em>&gt;</em></dd>
<dd><a href="#" target="_blank">餐边柜</a><em>&gt;</em></dd>
<dd><a href="#" target="_blank">酒柜</a><em>&gt;</em></dd>
</dl>
<dl>
<dt><a href="#" target="_blank">书房系列</a></dt>
<dd><a href="#" target="_blank">书桌</a><em>&gt;</em></dd>
<dd><a href="#" target="_blank">书柜</a><em>&gt;</em></dd>
<dd><a href="#" target="_blank">书椅</a><em>&gt;</em></dd>
</dl>
</div>
<div class="userDrapRight">
<div class="userrightOne">
<a href="#"><img src="http://img10.360buyimg.com/imgzone/jfs/t17191/54/2217822933/23200/5c0302ce/5aec3323Ne83af9f5.jpg" width="223" height="129"></a>
</div>
<div class="rightTow">
<a href="#"><img src="http://img10.360buyimg.com/imgzone/jfs/t19654/298/2242992012/23944/2462661c/5aec331fNc0f40f6c.jpg" width="223" height="129"></a>
</div>
<div class="userrightThr">
<a href="#"><img src="http://img10.360buyimg.com/imgzone/jfs/t16945/93/2282563284/19747/797bb6da/5aec3323N13f5353d.jpg" width="223" height="129"></a>
</div>
<div class="userrightFour">
<a href="#"><img src="http://img10.360buyimg.com/imgzone/jfs/t18463/51/2196200852/20598/2b43e1d2/5aec3323Ne0b230c0.jpg" width="223" height="129"></a>
</div>
</div>
</div>

</li>
<li>
<a href="https://mall.jd.com/index-590193.html" target="_blank">
<img src="http://img10.360buyimg.com/imgzone/jfs/t19261/74/2210515626/2647/4ab78291/5aec20b1N72f769d7.jpg" width="100" height="40">
</a>
</li>
<li>
<a href="https://mall.jd.com/advance_search-629101-598698-590193-0-0-0-1-1-60.html?keyword=%25E6%2582%25A0%25E8%25B4%25A8%25E5%25AE%25B6" target="_blank">
<img src="http://img10.360buyimg.com/imgzone/jfs/t17413/339/2284922556/4086/217a3dec/5aec20b1N28dc69ef.jpg" width="108" height="40">
</a>
</li>
<li class="userLiving">
<a href="https://mall.jd.com/advance_search-629101-598698-590193-0-0-0-1-1-60.html?keyword=%E5%AE%A2%E5%8E%85" target="_blank">
<img src="http://img10.360buyimg.com/imgzone/jfs/t19144/129/2181093039/2425/91b30aa5/5aec20b2N51a16364.jpg" width="101" height="40">
</a>
<dl>
<dd><a href="#">沙发</a></dd>
<dd><a href="#">茶几</a></dd>
<dd><a href="#">电视柜</a></dd>
<dd><a href="#">隔断柜</a></dd>
</dl>

</li>
<li class="userRoom">
<a href="https://mall.jd.com/advance_search-629101-598698-590193-0-0-0-1-1-60.html?keyword=%25E5%258D%25A7%25E5%25AE%25A4" target="_blank">
<img src="http://img10.360buyimg.com/imgzone/jfs/t19903/3/252872690/2426/ca96e5f5/5aec20b2Nabd692b4.jpg" width="81" height="40">
</a>
<dl>
<dd><a href="#">实木床</a></dd>
<dd><a href="#">床头柜</a></dd>
<dd><a href="#">床垫</a></dd>
<dd class="userlastBord"><a href="#">储物柜</a></dd>
</dl>

</li>
<li class="userRestaurant">
<a href="https://mall.jd.com/advance_search-629101-598698-590193-0-0-0-1-1-60.html?keyword=%25E9%25A4%2590%25E5%258E%2585" target="_blank">
<img src="http://img10.360buyimg.com/imgzone/jfs/t17077/343/2249102143/2335/1e621ffc/5aec20aeN3a486fc7.jpg" width="81" height="40">
</a>
<dl>
<dd><a href="#">餐桌</a></dd>
<dd><a href="#">餐椅</a></dd>
<dd class="userlastBord"><a href="#">餐边柜</a></dd>
</dl>
</li>
<li class="userDesk">
<a href="https://mall.jd.com/advance_search-629101-598698-590193-0-0-0-1-1-60.html?keyword=%E4%B9%A6%E6%88%BF" target="_blank">
<img src="http://img10.360buyimg.com/imgzone/jfs/t18073/105/2222252472/2376/2aac880b/5aec20b2Ndd0637ec.jpg" width="81" height="40">
</a>
<dl>
<dd><a href="#">书桌</a></dd>
<dd><a href="#">书柜</a></dd>
<dd class="userlastBord"><a href="#">书倚</a></dd>
</dl>
</li>
<li>
<img src="http://img10.360buyimg.com/imgzone/jfs/t19222/358/2182825829/3264/f88ff8ff/5aec20b2Nac238634.jpg" width="108" height="40">
</li>
<li class="userStore">
<a href="https://mall.jd.com/view_page-51460055.html" target="_blank">
<img src="http://img10.360buyimg.com/imgzone/jfs/t18343/49/2229747343/3612/eb15a03c/5aec20b2Ne6911522.jpg" width="116" height="40">
</a>
<dl>
<dd><a href="#">深圳欧亚达</a></dd>
<dd><a href="#">深圳佳得宝</a></dd>
<dd><a href="#">天津</a></dd>
<dd><a href="#">杭州</a></dd>
<dd><a href="#">上海</a></dd>
<dd><a href="#">西安</a></dd>
<dd class="userlastBord"><a href="#">广州</a></dd>
</dl>

</li>
<li>
<a href="https://mall.jd.com/view_page-51782227.html" target="_blank">
<img src="http://img10.360buyimg.com/imgzone/jfs/t17443/44/2238514909/3302/5bf2274b/5aec20b2N498da56c.jpg" width="116" height="40">
</a>
</li>
<li>
<a href="https://dd3-web.jd.com/pop/chat?shopId=590193&code=1" target="_blank">
<img src="http://img10.360buyimg.com/imgzone/jfs/t17404/249/2245032959/3001/fe5e3ce/5aec20b2N920bf594.jpg" width="116" height="40">
</a>
</li>
</ul>
<div class="userRight">
<img src="http://img10.360buyimg.com/imgzone/jfs/t19357/316/2264909018/2641/3c1e24fa/5aec20b2N52ed3e1b.jpg" width="394" height="40">
</div>

</div>

posted @ 2017-10-20 11:12  寻觅聪  阅读(559)  评论(0)  编辑  收藏  举报