移動端h5下ul實現橫向滾動css代碼

標籤：hid   add   isp   設定   code   style   移動端   品牌   category   

html代碼：

1 <ul id="category">2     <li>品牌團</li>3     <li>美體個護</li>4     <li>食品保健</li>5     <li>嬰幼兒</li>6     <li>百貨</li>7     <li>數位</li>8  </ul>

css代碼：

1 #category {width:100%;display: inline;white-space: nowrap;overflow-x:scroll;float:left;overflow-y:hidden}2 #category li{display:inline-block;width:80px;height:30px;padding-left:10px;}

關鍵點在於ul要設定float: left, overflow-x: scroll, overflow-y: hidden。

 

移動端h5下ul實現橫向滾動css代碼