<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>导航栏</title>
<link rel="stylesheet" href="mycss.css">
</head>
<body>
<div class="map">
<div class="tag">
<a href="">小米商城</a>
<a href="">loT</a>
<a href="">云服务</a>
<a href="">金融</a>
<a href="">有品</a>
<a href="">小爱开放平台</a>
<a href="">企业团购</a>
<a href="">资质证照</a>
<a href="">协议规则</a>
<a href="">下载app</a>
<a href="">Select Location</a>
</div>
<div class="info">
<a href="">登陆</a>
<a href="">注册</a>
<a href="">消息通知</a>
<a href="" class="car">🛒 购物车</a>
</div>
</div>
</body>
</html>
body {
margin: 0;
}
a {
text-decoration: none;
font-size: 12px;
color: #B0B0B0;
line-height: 50px;
margin-right: 10px;
}
a:hover {
color: white;
}
.map {
height: 50px;
width: 100%;
background: #333333;
}
.tag {
float:left;
margin-left:100px;
}
.info {
float:right;
margin-right: 100px;
}
.car {
display: inline-block;
background: #424242;
height: 100%;
width: 100px;
text-align: center;
}