CSS Scrollbar

CSS中若在块级容器上设置了overflow:scroll/overflow-x:scroll/overflow-y:scroll属性，当块级内容区域超出块级元素范围时会以滚动条的形式展示，可以滚动里面的内容，里面的内容不会超出块级区域范围。

滚动条组合部分

滚动条CSS伪元素

自定义滚动条的样式

::-webkit-scrollbar {
    width: 2px;
    height: 2px;
}
::-webkit-scrollbar-button {
    width: 0px;
    height: 0px;
}
::-webkit-scrollbar-thumb {
    background: #2d3748;
    border: 0px none #ffffff;
    border-radius: 50px;
}
::-webkit-scrollbar-thumb:hover {
    background: #2b6cb0;
}
::-webkit-scrollbar-thumb:active {
    background: #000000;
}
::-webkit-scrollbar-track {
    background: #1a202c;
    border: 0px none #ffffff;
    border-radius: 50px;
}
::-webkit-scrollbar-track:hover {
    background: #666666;
}
::-webkit-scrollbar-track:active {
    background: #333333;
}
::-webkit-scrollbar-corner {
    background: transparent;
}