通过css方法隐藏滚动条，目前只支持webkit内核的浏览器，当然如果是移动开发，基本都是兼容移动端的浏览器的（基本都是webkit内核的）。

html:

<div class="demo">
	1<br/>1<br/>1<br/>1<br/>1<br/>1<br/>
	1<br/>1<br/>1<br/>1<br/>1<br/>1<br/>
</div>

css:

.demo{
	width: 50px;height: 50px;background: #F0AD4E;
	overflow: auto;
}
::-webkit-scrollbar{
    display:none;
}

核心代码是：overflow的值需要设置为auto或者scroll，然后设置::-webkit-scrollbar的display属性为none。当然也可以通过设置滚动条的宽度为0，如下：

::-webkit-scrollbar{
	width:0px;
}

上面代码是针对所有的滚动条，如果只针对当前demo。css样式应该写为：.demo::-webkit-scrollbar{display:none;}。如果要考虑兼容性，可以结合js来实现隐藏滚动条。

本文内容仅供个人学习/研究/参考使用，不构成任何决策建议或专业指导。分享/转载时请标明原文来源，同时请勿将内容用于商业售卖、虚假宣传等非学习用途哦～感谢您的理解与支持！

链接: https://fly63.com/article/detial/176