<div class="outer-container">
<div class="inner-container">
<div class="content">
dfdsfdsfsdf
</div>
</div>
</div>
.content, .outer-container {
width: 200px;
height: 200px;
}
.outer-container {
position: relative;
overflow: hidden;
}
.inner-container {
position: absolute;
left: 0;
overflow-x: scroll;
overflow-y: scroll;
}
.inner-container::-webkit-scrollbar {
display: none;
}
该方案的实现原理:给外层的div和主要内容的div设置同样的宽高,然后.inner-container设置相对于.outer-container绝对定位,这样.inner-container就脱离了文档流,宽高子元素撑开,额外设置自己的滚动属性,但是由于最外层的div宽高固定,故.inner-container的滚动条看不到,事实上是可以滚动的