问题描述：

我有一个3 div的div，其中每个div独立滚动。如何隐藏水平滚动条，但仍然能够滚动

<div class="divWrapper"> 
    <div class="item"></div> 
    <div class="item"></div> 
    <div class="item"></div> 
</div> 

.item { 
    position: relative; 
    -webkit-overflow-scrolling: touch; 
    overflow-scrolling: touch; 
    overflow-x: auto; 
    white-space: nowrap; 
    box-sizing: border-box; 
    padding: 0 16px; 
    font-size: 0; 
}

虽然滚动我想隐藏滚动条。在Windows上，所有浏览器都不显示滚动条，但在MAC滚动条上可见。有没有办法让滚动，而没有滚动条可见？

** CSS ** :: - webkit-scrollbar：display：none –

@ZeusZdravkov感谢它对我有用 – User1979

请注意，这只适用于Webkit浏览器和那些识别'-webkit-'前缀的浏览器。 – Shaggy

答

它应该是oveyflow-x: hidden不overflow-x: auto

这样你将无法水平滚动。 – LuudJacobs

检查这个http://stackoverflow.com/questions/16670931/hide-scroll-bar-but-still-being-able-to-scroll?rq=1 –

@OkeTega是垂直滚动。 – Radmation

答

在WebKit浏览器自定义滚动条

所以 CSS是

::-webkit-scrollbar { 
    display: none; 
}

在此主题的更多：https://css-tricks.com/custom-scrollbars-in-webkit/

如何隐藏水平滚动条，但仍然能够滚动

在WebKit浏览器自定义滚动条

相关推荐