作业：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>导航条</title>
<style type="text/css">
*{
margin: 0;
padding:0;
}
.nav{
list-style: none;
margin: 50px auto;
background-color: #E0FFFF;
overflow: hidden;
}
.nav li{
float: left;
width: 8%;
}
.nav a{
display: block;
width: 100%;
text-align: center;
padding:5px;
text-decoration: none;
color:#63B8FF;
font-weight: bold;
font-size: 10px;
}
.nav a:hover{
background-color: #FFF8DC;
color:#EE0000;
font-family: '隶书';
font-size: 15px;
}
.one li{
float: right;
width: 4%;
}
.one{
text-align: center;
display: block;
width: 100%;
text-decoration: none;
}
.one a{
display: block;
width: 100%;
text-align:center;
padding:5px;
text-decoration: none;
color:#63B8FF;
font-weight: bold;
font-size: 10px;
</style>
</head>
<body>
<div>
<ul class="nav">
<li><a href="https://www.amazon.cn/ap/signin?_encoding=UTF8&openid.assoc_handle=cnflex&openid.claimed_id=http%3A%2F%2Fspecs.openid.net%2Fauth%2F2.0%2Fidentifier_select&openid.identity=http%3A%2F%2Fspecs.openid.net%2Fauth%2F2.0%2Fidentifier_select&openid.mode=checkid_setup&openid.ns=http%3A%2F%2Fspecs.openid.net%2Fauth%2F2.0&openid.ns.pape=http%3A%2F%2Fspecs.openid.net%2Fextensions%2Fpape%2F1.0&openid.pape.max_auth_age=0&openid.return_to=https%3A%2F%2Fwww.amazon.cn%2Fgp%2Fyourstore%2Fcard%3Fie%3DUTF8%26ref_%3Dcust_rec_intestitial_signin" target="_blank">我的亚马逊</a></li>
<li><a href="https://www.amazon.cn/gp/goldbox/ref=nav_cs_top_nav_gb27" target="_blank">Z秒杀</a></li>
<li><a href="https://www.amazon.cn/gift-cards/b?ie=UTF8&node=311868071" target="_blank">礼品卡</a></li>
<li><a href="https://www.amazon.cn/gp/feature.html/ref=nav_topnav_sell?ie=UTF8&docId=1503558" target="_blank">我要开店</a></li>
<li><a href="https://www.amazon.cn/%E4%BA%9A%E9%A9%AC%E9%80%8A%E6%B5%B7%E5%A4%96%E8%B4%AD/b/ref=nav_nav_topnav_ags?ie=UTF8&node=1403206071" target="_blank">海外购</a></li>
<li><a href="https://www.amazon.cn/gp/help/customer/display.html/ref=nav_topnav_help" target="_blank">帮助</a></li>
<div class="one">
<li><a href="#">购物车</a></li>
<li><a href="#">注册</a></li>
<li><a href="#">登录</a></li>
</div>
</ul>
</div>
</body>
</html>
导航条
网友评论