abstract：<!DOCTYPE html><html><head> <title>天猫tmall.com--理想生活上天猫</title> <meta charset="utf-8"> <link rel="stylesheet" href="font-awesome/css/fon
<!DOCTYPE html>
<html>
<head>
<title>天猫tmall.com--理想生活上天猫</title>
<meta charset="utf-8">
<link rel="stylesheet" href="font-awesome/css/font-awesome.min.css">
<style>
*{margin:0;padding:0;}
.nav{width:100%;background-color: #f2f2f2;}
.nav_content{margin:0 auto;width:1230px;height:34px;line-height:34px;text-align:center;font-size:12px;}
.nav_content_left{width:220px;float:left;}
.nav_content_left a{margin-right:15px;}
.nav_content_right{width:520px;float:right;}
.nav_menu_one{position:relative;padding:0 8px;float:left;}
.nav_menu_two{padding:10px 10px;line-height:22px;position:absolute;display:none;border:1px solid #e0e0e0;border-top:none;}
.pos_left{left:-1px;top:34px;width:80px;}
.pos_cen{left:-60px;top:34px;width:160px;}
.pos_right{right:-1px;top:34px;}
.nav a{text-decoration: none;color:gray;}
.nav a:hover{color:red;}
.nav li{list-style-type: none;}
.nav li:hover{background-color: #fff;border:1px solid #e0e0e0;border-bottom:none;}
.nav li:hover .nav_menu_two{display:block;}
.nav li a:hover
</style>
</head>
<body>
<div class="nav">
<div class="nav_content">
<div class="nav_content_left">
<span style="color:gray;margin-right:15px;">喵，欢迎来天猫</span>
<a href="">请登录</a>
<a href="">免费注册</a>
</div>
<ul class="nav_content_right">
<li class="nav_menu_one">
<a href="">我的淘宝<i class="fa fa-angle-down"></i></a>
<div class="nav_menu_two pos_left">
<a href="" >已买到的宝贝</a><br>
<a href="" >已卖出的宝贝</a>
</div>
</li>
<li class="nav_menu_one">
<i class="fa fa-shopping-cart" style="color:red;padding-right:5px;"></i><a href="">购物车件</a>
</li>
<li class="nav_menu_one">
<a href="">收藏夹</a><i class="fa fa-angle-down"></i>
<div class="nav_menu_two pos_left">
<a href="">收藏的宝贝</a><br>
<a href="">收藏的店铺</a>
</div>
</li>
<li class="nav_menu_one">
<i class="fa fa-mobile" style="color:red;padding-right:5px;"></i><a href="">手机版</a>
<div class="nav_menu_two pos_cen" style="padding:0;">
<img src="images/2dbarcode.png">
</div>
</li>
<li class="nav_menu_one">
<a href="">淘宝网</a>
</li>
<li class="nav_menu_one">
<a href="">商家支持</a><i class="fa fa-angle-down"></i>
<div class="nav_menu_two pos_right" style="width:130px;">
<a style="text-align:left;font-weight:600;">商家：</a><br>
<a href="" style="margin-right:20px;">商家中心</a><a href="">天猫规则</a><br>
<a href="" style="margin-right:20px;">商家入驻</a><a href="">运营服务</a><br>
<a href="" style="margin-right:20px;">商家品控</a><a href="">商家工具</a><br>
<a href="" style="margin-right:20px;">天猫智库</a><a href="">喵言喵语</a>
<a style="text-align:left;font-weight:600;">帮助：</a>
<div style="border-bottom:1px dashed #e0e0e0;"></div>
<a href="" style="margin-right:20px;">帮助中心</a><a href="">问商友</a>
</div>
</li>
<li class="nav_menu_one">
<i class="fa fa-bars" style="color:red;padding-right:5px;"></i><a href="">网站导航</a><i class="fa fa-angle-down"></i>
<div class="nav_menu_two pos_right" style="width:1200px;height:150px;">
<div style="width:400px;font-size:14px;font-weight:600;color:red;float:left;">热点推荐</div>
<div style="width:400px;font-size:14px;font-weight:600;color:blue;float:left;">行业市场</div>
<div style="width:300px;font-size:14px;font-weight:600;float:left;">服务指南</div>
</div>
</li>
</ul>
</div>
</div>
</body>
</html>
一级菜单可用a标签，二级菜单可用ul标签，巧用二级菜单行高。
Correcting teacher：查无此人Correction time：2019-05-05 09:34:52
Teacher's summary：完成的不错。常用的css样式，可以写到一个公用文件里，随时可以使用。继续加油。