移動端瀏覽器將頁面的滾動條自動隱藏，同時又保證頁面可以滾動，使用者可以手動上下翻。pc端瀏覽器不會將頁面的滾動條自動隱藏，在出現橫向滾動條時候有可能會覆蓋內容，直接隱藏橫向滾動條會導致無法橫向滾動。
如何做到既隱藏滾動條，又可以橫向滾動？
設想是不是可以隱藏了滾動條的大部分，留下一小部分，用來滾動檢視內容。
下面一起來實現這個hack吧
//html結構
class
="demo-tab"
>
"items"
>
class
="item"
>
class
="item-on"
>
div>
li>
calss
="item"
>
>
div>
li>
class
="item"
>
>
div>
li>
class
="item"
>
>
div>
li>
ul>
div>
//css
>
.demo-tab
.demo-tab ul
.item
.item-on
style
>
外層的div的高度要比里層ul/div或者其它元素的高度小，然後overflow:hidden，這樣就可以隱藏了滾動條的大部分，留下一小部分，用來滾動檢視內容。
特徵chrome
firefox
safari
edge
ieopera
基本支援
yesyes
yesyes
9+yes
移動端瀏覽器將頁面的滾動條自動隱藏，同時又保證頁面可以滾動，使用者可以手動上下翻。pc端瀏覽器不會將頁面的滾動條自動隱藏，在出現橫向滾動條時候有可能會擠壓頁面內容，造成頁面布局混亂。
如何做到既隱藏滾動條，又可以縱向滾動？
//html結構
class
="outer-container"
>
class
="inner-container"
>
class
="content"
>
......
div>
div>
div>
//css
>
.outer-container,.content
.outer-container
.inner-container
/* for chrome */
.inner-container::-webkit-scrollbar
style
>
滾動容器父級溢位隱藏，滾動容器絕對定位左對齊，滾動條超出父級元素，所以滾動條就隱藏了，只能通過滑鼠滾輪滾動。
特徵chrome
firefox
safari
edge
ieopera
基本支援
yesyes
yesyes
6+yes
1、jquery滾動條外掛程式-jquery custom content scroller
2、簡潔的jquery滾動條外掛程式scrollbar.js
3、nicescroll
4、iscroll
CSS 隱藏滾動條
hello無論如何我都想 hello無論如何我都想 hello無論如何我都想要 hello無論如何我都想 hello無論如何我都想要對 hello無論如何我都想 hello無論如何我都想要對你 hello無論如何我都想要對你 hello無論如何我都想 hello無論如何我都想要對你 hello無論如...
css 隱藏滾動條
如何隱藏滾動條，同時仍然可以在任何元素上滾動？首先，如果需要隱藏滾動條並在內容溢位時顯示滾動條，只需要設定overflow auto樣式即可。想要完全隱藏滾動條只需設定overflow hidden即可，但是這樣一來將導致元素內容不可滾動。時至今日，還沒有任何一條css規則可以使元素可以隱藏滾動條的...
隱藏滾動條css3實現滾動同時隱藏滾動條
專案場景需求要在區域性實現滾動，但是滾動出現了滾動條，一瞬間感覺整個頁面都不好了，經過努力css成功實現滾動同時隱藏滾動條，廢話不多說，直接上 隱藏滾動條title ulli ulul webkit scrollbar style head 測試隱藏滾動條li 測試隱藏滾動條li 測試隱藏滾動條li...