使用css实现移动端导航条滚动

 1 <div class="tab">
 2   <div class="table-item">
 3     <span class="tab-link">首页</span>
 4   </div>
 5   <div class="table-item">
 6     <span class="tab-link">时政</span>
 7   </div>
 8   <div class="table-item">
 9     <span class="tab-link">思想理论</span>
10   </div>
11   <div class="table-item">
12     <span class="tab-link">党建经验</span>
13   </div>
14   <div class="table-item">
15     <span class="tab-link">最新动态</span>
16   </div>
17   <div class="table-item">
18     <span class="tab-link">中铁鲁班商务网</span>
19   </div>
20 </div>

 1 .tab {
 2     white-space: nowrap; // 这个必须有
 3     height: 1.466666666666667rem;
 4     line-height: 1.466666666666667rem;
 5     font-size: 0.426666666666667rem;
 6     overflow-y: hidden; // 这个必须有
 7 }
 8 .tab .table-item {
 9     padding-left: 0.133333333333333rem;
10     padding-right: 0.133333333333333rem;
11     display: inline-block; // 这个必须有
12 }

这个demo在浏览器模拟的时候会有底部滚动条，当在真机上时，滚动条会消失

原文地址：https://www.cnblogs.com/zhaobao1830/p/8383619.html