html
<nav>
<a href="javaScrpt:void(0)" class="back">返回</a>
<a href="javaScrpt:void(0)" class="title">联名会员卡预约</a>
<a href="javaScrpt:void(0)" class="more"><i></i></a>
</nav>
nav{
height: 4rem;
background: #19181D;
width: 100%;
z-index: 2000!important;
position: relative;
color: #FFFFFF;
display: flex;
}
nav a{
display: block;
flex:1;
height: 4rem;
color: #FFFFFF;
line-height: 4rem;
text-align: center;
}
nav a:link, nav a:hover{
color: #FFFFFF;
}
nav .title{
flex:4;
text-align: center;
font-size: 1.8rem;
font-weight: bold;
letter-spacing: 2px;
}
nav .back::before{
content: '';
border-top: .2rem solid #fff;
border-left: .2rem solid #fff;
width: .8rem;
height: .76rem;
-webkit-transform: rotate(-45deg);
margin-left: 1.3rem;
margin-top: 1.4rem;
display: inline-block;
}
.more::before, .more>i::before, .more>i::after{
content: '';
background: #FFFFFF;
width: .5rem;
height: .5rem;
display: inline-block;
border-radius: 50%;
margin: 0 .15rem;
}
