<div id="ios_scroll_hidden">
<div id="nav" class="no_scroll">
<a class="active" href="#">首页</a>
<a href="#">电器</a>
<a href="#">百货</a>
<a href="#">男装</a>
<a href="#">食品</a>
<a href="#">生鲜</a>
<a href="#">进口</a>
<a href="#">手机</a>
<a href="#">其它</a>
</div>
</div>
#ios_scroll_hidden{
height: 5.4rem; /*高度设置小一点*/
overflow: hidden;/*隐藏苹果滚动条*/
}
#nav{
display: flex; /*区块一行显示*/
width: 100%;
height: 6rem;
overflow-x: scroll;
overflow-y: hidden; /*支持滑动*/
white-space: nowrap; /*不换行*/
-webkit-overflow-scrolling: touch; /*解决滑动卡顿*/
background: #fff;
padding:0 0.5rem;
}
#nav a{
display: block;
flex-shrink: 0; /*不被缩放*/
font-size: 2rem;
line-height: 6rem;
padding:0 1rem;
position: relative;
}
#nav a.active{
color:#c9423f;
}
#nav a.active:before{
content: '';
position:absolute;
width:100%;
height: 2px;
bottom:0.6rem;
left:0px;
background: #c9423f;
}