方法
.scroll {
padding-bottom: 10px;
margin-bottom: -10px;
}
附案例
html
<div id="slider" class="slider">
<nav class="scroll">
<a class="control-item active" href="#">推荐</a>
<a class="control-item" href="#">热点</a>
<a class="control-item" href="#">北京</a>
<a class="control-item" href="#">社会</a>
<a class="control-item" href="#">娱乐</a>
<a class="control-item" href="#">科技</a>
</nav>
</div>
css
.slider {
widows: 100%;
line-height: 40px;
overflow: hidden;
}
.scroll {
overflow-x: scroll;
padding-bottom: 10px;
margin-bottom: -10px;
white-space: nowrap;
}
.control-item {
display: inline-block;
width: 100px;
text-align: center;
}