taobao顶部菜单
2019-02-24 02:02:03350<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<meta name="Generator" content="EditPlus®">
<meta name="Author" content="">
<meta name="Keywords" content="">
<meta name="Description" content="">
<link rel="stylesheet" href="css/1.css" type="text/css">
<link rel="stylesheet" href="css/font-awesome-4.7.0/css/font-awesome.min.css" type="text/css">
<link href="https://img.alicdn.com/tps/i3/T1OjaVFl4dXXa.JOZB-114-114.png" rel="apple-touch-icon-precomposed" />
<title>淘宝网 - 淘！我呸</title>
</head>
<body>
<div >
<div >
<div >
<a href="" id="zgdl">中国大陆 <i class=" fa fa-angle-down"></i></a>
<a href="https://login.taobao.com/member/login.jhtml?spm=a21bo.2017.754894437.1.5b7f11d9MKfHOT&f=top&redirectURL=https%3A%2F%2Fwww.taobao.com%2F%3Fspm%3Da2107.1.1000340.1.326911d929ds3u" style="color:#ff5000;">亲，请登录</a>
<a href="https://reg.taobao.com/member/reg/fill_mobile.htm" id="">免费注册</a>
<a href="https://mpage.taobao.com/hd/download.html?spm=a21bo.2017.1997563273.1.5b7f11d9WZdq2b" id="">手机逛淘宝</a>
</div>
<div >
<a href="" id="zgdl">我的淘宝<i class=" fa fa-angle-down"></i></a>
<a href="" id="zgdl"><span class="fa fa-cart-plus"></span> 购物车</a>
<a href="" id="zgdl"><span class="fa fa-star"></span> 收藏夹<i class=" fa fa-angle-down"></i></a>
<a href="">商品分类</a>
<a href="" id="zgdl">卖家中心 <i class=" fa fa-angle-down"></i></a>
<a href="" id="zgdl">联系客服 <i class=" fa fa-angle-down"></i></a>
<a href="">网站导航</a>
</div>
</div>
<div id="" >
</div>
</div>
</body>
</html>
————————————————————————————
css
————————————————————
*{margin:0px;padding:0px;} /* 做网页第一步，先把浏览器自带的边距清除 */
a{text-decoration:none;color:#000;font-size:12px;}/* text-decoration:none;去掉a链接的下划线 */
.clear{clear:both;}
.header{width:100%;background-color:#f5f5f5;}/* height:35px; */
.header_content{width:1200px;margin:0px auto;line-height:40px;}/* height:40px; */
.header_left{height:40px;float:left;}/* background-color:pink; 调试用的*/
.header_left a{margin-right:5px;}
.header_content a:hover{color:#ff5000;}
.header_right{width:600px;height:40px;float:right;}/* background-color:pink; */
#zgdl{display:inline-block;height:40px;width:90px;text-align:center;}/* background-color:#f40; */
#zgdl:hover{background-color:#fff;}