一、覆盖隐藏
取巧的方法,原理是通过给滚动条所在块元素外嵌套一个块元素,调整边距,覆盖隐藏。
例如
第一步:给div外部创建一个同样大小的div。
.box1 {
width: 200px;
height: 200px;
}
.box2{
width: 100%;
height: 100%;
}
第二步:给父元素div设置超出部分遮挡,overflow: hidden;子元素div调整边距使其隐藏在父元素div之下即可。
.box1 {
width: 200px;
height: 200px;
overflow: hidden;
}
.box2{
width: 100%;
height: 100%;
overflow-y: scroll;
padding-left: 15px;
}
注意:如果是给整个页面设置,可以父元素(html)子元素(body)
二、使用::-webkit-scrollbar设置displa属性none
div{
width: 200px;
height:200px;
overflow-y: scroll;
}
::-webkit-scrollbar{
display: none;
}
注意:此方法在IE上不生效。