天猫商城左侧导航
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>(仿)天猫商城导航</title>
<script src="http://code.jquery.com/jquery-3.4.1.min.js"></script>
<link rel="stylesheet" href="style.css">
<link href="//netdna.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet">
</head>
<body>
<!-- 顶部导航 -->
<div class="top">
<div class="content">
<div class="left">
<a href="#">喵, 欢迎来到天猫</a>
<a href="#">请登录</a>
<a href="#">免费注册</a>
</div>
<ul class="right">
<li><a href="http://" target="_blank" rel="noopener noreferrer">我的淘宝</a>
<div class="number">
<a href="#">已买到的宝贝</a><br>
<a href="#">已卖出的宝贝</a>
</div>
</li>
<li><a href="http://" target="_blank" rel="noopener noreferrer"><i class="fa fa-heart"></i> 我关注的品牌</a>
</li>
<li><a href="http://" target="_blank" rel="noopener noreferrer"><i class="fa fa-shopping-cart"></i>
购物车0件</a></li>
<li><a href="http://" target="_blank" rel="noopener noreferrer">收藏夹</a>
<div class="dope">
<a href="#">收藏的店铺</a><br>
<a href="#">收藏的宝贝</a>
</div>
</li>
<li><a href="http://" target="_blank" rel="noopener noreferrer">|</a></li>
<li><a href="http://" target="_blank" rel="noopener noreferrer"><i class="fa fa-android"></i> 手机版</a>
</li>
<li><a href="http://" target="_blank" rel="noopener noreferrer">淘宝网</a></li>
<li><a href="http://" target="_blank" rel="noopener noreferrer">网页导航</a>
<div id="website">
</div>
</li>
</ul>
</div>
<div class="clear"></div>
</div>
<!-- 左侧导航 -->
<div class="middle">
<div class="content">
<ul class="menu">
<li><a href="http://" target="_blank"><i class="fa fa-shopping-cart"></i> 女装/内衣</a>
<div class="sub-menu">
<div class="sub-menu-left">
<p><b>当季流行1</b><span class="fa fa-angle-right"></span></p>
<p class="hr">
<a href="">夏季新品</a>
<a href="">商场同款</a>
<a href="">仙女连衣裙</a>
<a href="">T恤</a>
<a href="">衬衫</a>
<a href="">时髦外套</a>
<a href="">休闲外套</a>
<a href="">牛仔裤</a><br>
<a href="">无痕文胸</a>
<a href="">运动文胸</a>
<a href="">潮流家居服</a>
<a href="">百搭船袜</a>
</p>
<p><b>当季流行</b><span class="fa fa-angle-right"></span></p>
<p class="hr">
<a href="">夏季新品</a>
<a href="">商场同款</a>
<a href="">仙女连衣裙</a>
<a href="">T恤</a>
<a href="">衬衫</a>
<a href="">时髦外套</a>
<a href="">休闲外套</a>
<a href="">牛仔裤</a><br>
<a href="">无痕文胸</a>
<a href="">运动文胸</a>
<a href="">潮流家居服</a>
<a href="">百搭船袜</a>
</p>
<p><b>当季流行</b><span class="fa fa-angle-right"></span></p>
<p class="hr">
<a href="">夏季新品</a>
<a href="">商场同款</a>
<a href="">仙女连衣裙</a>
<a href="">T恤</a>
<a href="">衬衫</a>
<a href="">时髦外套</a>
<a href="">休闲外套</a>
<a href="">牛仔裤</a><br>
<a href="">无痕文胸</a>
<a href="">运动文胸</a>
<a href="">潮流家居服</a>
<a href="">百搭船袜</a>
</p>
<p><b>当季流行</b><span class="fa fa-angle-right"></span></p>
<p class="">
<a href="">夏季新品</a>
<a href="">商场同款</a>
<a href="">仙女连衣裙</a>
<a href="">T恤</a>
<a href="">衬衫</a>
<a href="">时髦外套</a>
<a href="">休闲外套</a>
<a href="">牛仔裤</a><br>
</p>
</div>
<div class="sub-menu-right">
<a href=""><img src="08.jpg" alt=""></a>
<a href=""><img src="08.jpg" alt=""></a>
<a href=""><img src="08.jpg" alt=""></a>
<a href=""><img src="08.jpg" alt=""></a>
<a href=""><img src="08.jpg" alt=""></a>
<a href=""><img src="08.jpg" alt=""></a>
<a href=""><img src="08.jpg" alt=""></a>
<a href=""><img src="08.jpg" alt=""></a>
<a href=""><img src="08.jpg" alt=""></a>
<a href=""><img src="08.jpg" alt=""></a>
<a href=""><img src="08.jpg" alt=""></a>
<a href=""><img src="08.jpg" alt=""></a>
<a href=""><img src="08.jpg" alt=""></a>
<a href=""><img src="08.jpg" alt=""></a>
<a href=""><img src="08.jpg" alt=""></a>
</div>
</div>
</li>
<li><a href="http://" target="_blank"><i class="fa fa-shopping-cart"></i> 男装/运动户外</a>
<div class="sub-menu">
<div class="sub-menu-left">
<p><b>当季流行2</b><span class="fa fa-angle-right"></span></p>
<p class="hr">
<a href="">夏季新品</a>
<a href="">商场同款</a>
<a href="">仙女连衣裙</a>
<a href="">T恤</a>
<a href="">衬衫</a>
<a href="">时髦外套</a>
<a href="">休闲外套</a>
<a href="">牛仔裤</a><br>
<a href="">无痕文胸</a>
<a href="">运动文胸</a>
<a href="">潮流家居服</a>
<a href="">百搭船袜</a>
</p>
<p><b>当季流行</b><span class="fa fa-angle-right"></span></p>
<p class="hr">
<a href="">夏季新品</a>
<a href="">商场同款</a>
<a href="">仙女连衣裙</a>
<a href="">T恤</a>
<a href="">衬衫</a>
<a href="">时髦外套</a>
<a href="">休闲外套</a>
<a href="">牛仔裤</a><br>
<a href="">无痕文胸</a>
<a href="">运动文胸</a>
<a href="">潮流家居服</a>
<a href="">百搭船袜</a>
</p>
<p><b>当季流行</b><span class="fa fa-angle-right"></span></p>
<p class="hr">
<a href="">夏季新品</a>
<a href="">商场同款</a>
<a href="">仙女连衣裙</a>
<a href="">T恤</a>
<a href="">衬衫</a>
<a href="">时髦外套</a>
<a href="">休闲外套</a>
<a href="">牛仔裤</a><br>
<a href="">无痕文胸</a>
<a href="">运动文胸</a>
<a href="">潮流家居服</a>
<a href="">百搭船袜</a>
</p>
<p><b>当季流行</b><span class="fa fa-angle-right"></span></p>
<p class="">
<a href="">夏季新品</a>
<a href="">商场同款</a>
<a href="">仙女连衣裙</a>
<a href="">T恤</a>
<a href="">衬衫</a>
<a href="">时髦外套</a>
<a href="">休闲外套</a>
<a href="">牛仔裤</a><br>
</p>
</div>
<div class="sub-menu-right">
&a
