abstract：<!DOCTYPE html><html><head> <meta charset="utf-8" /> <title>仿京东顶部导航栏</title> <link rel="stylesheet" type="text/css&quo
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>仿京东顶部导航栏</title>
<link rel="stylesheet" type="text/css" href="4.css" />
<link rel="stylesheet" type="text/css" href="font-awesome-4.7.0/css/font-awesome.min.css" />
<style type="text/css">
*{
margin:0px;
padding:0px;
}
.header{
width:100%;
height:35px;
background-color:#E3E4E5;
}
.header_content{
width:1200px;
height:35px;
margin:auto;
padding:0px;
}
.header_left{
width:300px;
height:35px;
line-height:35px;
float:left;
}
.header_right{
width:800px;
height:35px;
line-height:35px;
float:right;
}
.header_k{
width:190px;
height:170px;
background-color:#fff;
box-shadow:0px opx 5px #E3E4E5;
float:left;
}
.header_b{
width:190px;
height:170px;
background-color:#fff;
box-shadow:0px 0px 6px #ccc;
float:left;
}
.header_content li{
list-style:none;
color:#999999;
height:15px;
line-height:15px;
text-align:center;
font-size:12px;
float:right;
margin:10px 0px;
padding:0px 8px;
border-right:1px solid #ccc;
}
.header_content li:hover{color:#F10215;}
.header_m:hover{
background-color:#fff;
}
</style>
</head>
<body>
<div class="header">
<div class="header_content">
<div class="header_left">
<div class="header_b"><image src="images/sprite.head.png" /></div>
<ul>
<li style="float:left;border-right:0px;" class="header_m"><span class="fa fa-map-marker" style="color:#F10215;"></span> 北京</li>
</ul>
</div>
<div class="header_right">
<ul>
<li>手机京东</li>
<li >网站导航 <span class="fa fa-angle-down"></span></li>
<li class="header_m">客户服务 <span class="fa fa-angle-down"></span></li>
<li class="header_m">企业采购 <span class="fa fa-angle-down"></span></li>
<li>京东会员</li>
<li class="header_m">我的京东 <span class="fa fa-angle-down"></span></li>
<li>我的订单</li>
<li style="color:#F10215;">免费注册</li>
<li>你好，请登录</li>
</ul>
</div>
</div>
</div>
</body>
</html>
Correcting teacher：韦小宝Correction time：2019-02-20 16:36:37
Teacher's summary：写的很不错 基本上各大网站的导航都是一样的