移動端滑動導航條
阿新 • • 發佈:2018-12-14
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; }