今天寫一個模板的時候，在手機(jī)端需要橫線羅列菜單，為減少占用空間，采用了橫向滾動(滑動)效果，并且隱藏滾動條！
最后寫的CSS還是不支持firefox，在firefox的瀏覽器上滾動條隱藏不掉。。。不管了，因?yàn)檫@個橫向滾動是運(yùn)用在手機(jī)端，不會出現(xiàn)firefox的問題！
相關(guān)：
1、純CSS3自定義滾動條樣式設(shè)置方法大全（不兼容firefox）
2、jQuery插件 -滾動條樣式-jQuery custom content scroller，兼容所有瀏覽器，但太大，也容易卡
HTML：
<div id="maincate" class="maincate"> <a href="#">需要滾動菜單</a> <a href="#">需要滾動菜單</a> <a href="#">需要滾動菜單</a> <a href="#">需要滾動菜單</a> <a href="#">需要滾動菜單</a> ..... </div>
CSS：
.maincate{width:100%; height: 50px;line-height: 50px;white-space: nowrap;box-shadow: 0 1px 2px rgba(0,0,0,.1);
overflow-x: scroll; /* 1 */
overflow-y: hidden;
-webkit-backface-visibility: hidden;
-webkit-perspective: 1000;
-webkit-overflow-scrolling: touch; /* 2 */
text-align: justify; /* 3 */
}
.maincate::-webkit-scrollbar{display: none;} //隱藏滾動條！
.maincate a{ height: 50px;display: inline;}這個方法雖然不支持firefox，但用在移動端設(shè)備上是沒有問題的！