HTML：
1班2班-淘宝基础 <!--头部开始-->
<div class="h-line1">
<div class="h-con">
<div class="address">广州市 <span class="bor"></span></div>
<ul class="h-list">
<li class="diagonal"><a href="#">请登录</a></li>
<li class="diagonal"><a href="#">注册</a></li>
<li class="diagonal"><a href="#"><i class="gift"></i>签到有礼</a></li>
<li class="diagonal"><a href="#">我的订单</a></li>
<li class="diagonal"><a href="#">我的特卖</a><span class="bor"></span></li>
<li class="diagonal"><a href="#">会员俱乐部</a><span class="bor"></span></li>
<li class="diagonal"><a href="#">客户服务</a><span class="bor"></span></li>
<li class="diagonal"><a href="#"><i class="phone"></i>手机版</a></li>
<li><a href="#">更多</a><span class="bor"></span></li>
</ul>
</div>
</div>
<!--头部结束-->
<!--搜索区域开始-->
<!--搜索区域结束-->
<!--导航开始-->
<!--导航结束-->
CSS:*{margin:0;padding:0;}
li{list-style:none; /取消小黑点/}
/头部开始/ .h-line1{ height:30px; background:#f5f5f5; } .h-con{ width:1172px; height:30px; margin:0 auto;/水平自适应/ } .address{ float:left; font-size:12px; color:#333333; height:30px; line-height:30px; width:76px; text-indent:14px; position:relative; } .bor{ width:0px; height:0px; position:absolute; right:0px; top:12px; /* border-left:10px solid rgba(0,0,0,0); border-right:10px solid transparent; border-top:10px solid #333; border-bottom:10px solid rgba(0,0,0,0); */ border:4px solid rgba(0,0,0,0); border-top-color:#333;
} .h-list{ float:right; height:30px; font-size:12px; line-height:30px; } .h-list li{ float:left; padding-left: 22px; position: relative; } .diagonal:after{ content:""; display:block; width:8px; height:10px; background:url("images/sprites.png")no-repeat -212px -187px; float:right; margin-top:10px; margin-left:22px; } .h-list li a{float: left;} .h-list li .bor{ position: static; float: left; margin-top: 14px; margin-left: 5px; } .h-list li:last-child{ margin-right: 23px; }
.h-list li .gift{ float: left; width: 15px; height: 18px; background: url(/images/qiandao.gif)no-repeat center blue; margin-top: 4px; margin-right: 4px;
}
.h-list li .phone{ float: left; width: 10px; height: 14px; background: url(/images/sprites.png)no-repeat -294px -142px blue; margin-top: 8px; margin-right: 8px;
}
/头部结束/
/搜索区域开始/
/搜索区域结束/
/导航开始/
/导航结束/
