移动端滑动导航条

HTML

<div class="tab">
			<div class="table-item">
				<p>二维码</p>
				<p>10</p>
			</div>
			<div class="table-item">
				<p>助理活动</p>
				<p>10</p>
			</div>
			<div class="table-item">
				<p>红包活动</p>
				<p>10</p>
			</div>
			<div class="table-item">
				<p>其他入口</p>
				<p>10</p>
			</div>
			<div class="table-item">
				<p>首页</p>
				<p>10</p>
			</div>
			<div class="table-item">
				<p>首页</p>
				<p>10</p>
			</div>
		</div>

css

.tab {
			    white-space: nowrap; 
			    height: 3rem;
			    overflow-y: hidden; 
			}
			.tab .table-item {
				width: 5rem;
			    padding-right: 0.133333333333333rem;
			    display: inline-block; 
			    text-align: center;
			}
			.tab .table-item>p{
				margin: 0;
				font-family: PingFangSC-Regular;
				font-size: 13px;
				color: lawngreen;
			}