overflow 属性可以控制内容溢出，将对应区域内超出部分进行隐藏或者添加滚动条。
overflow的属性：
| visible | 默认值。内容不会被修剪，会呈现在元素框之外。 |
| hidden | 内容会被修剪，并且其余内容是不可见的。 |
| scroll | 内容会被修剪，但是浏览器会显示滚动条以便查看其余的内容。 |
| auto | 如果内容被修剪，则浏览器会显示滚动条以便查看其余的内容。 |
| inherit | 规定应该从父元素继承 overflow 属性的值。 |
对x轴自适应设置：overflow-x:auto;
对y轴隐藏设置：overflow-y:hidden;
页面HTML：
<div class="box"></div>
页面CSS样式：(一定要设置宽高，否则不生效，不会出现溢出情况)
.box{
width: 500px;
height: 500px;
overflow: scroll;border: 1px solid pink;
}
当纵向超出显示滚动条时，对滚动条样式进行隐藏：
//滚动条里的小方块
.box::-webkit-scrollbar-thumb {
border-radius: 3px;
background-color:gray;
}//滚动条整体样式
.box::-webkit-scrollbar {
width: 5px;
height: 5px; //高宽分别对应横竖滚动条的尺寸
}
//滚动条中心部分
.box::-webkit-scrollbar-track {
background-color:pink;
}
上述滚动条想要什么样式，根据自己的需求对应去修改即可。