总会遇到需要修改页面滚动条的需求
如果需要全局修改 就在大文件中添加
::-webkit-scrollbar { /* 滚动条整体样式 */ width: 6px; /* 宽高分别对应横竖滚动条的尺寸 */ background: rgb(235, 238, 245); border-radius: 10px; -webkit-box-shadow: inset 1px 0 1px rgba(0,0,0,0.2); } ::-webkit-scrollbar-thumb { /* 滚动条里的小方块 */ border-radius: 3px; background: #2e4a89; height: 120px; } ::-webkit-scrollbar-track { /* 滚动条里面的轨道 */
-webkit-box-shadow: inset 0 0 5px rgba(0,0,0,0.2); border-radius: 10px; background: rgba(0,0,0,0.1); }
需要某个特定的滚动条修改 就在：：前加入需要修改的类名
如果前面的修改没有生效 安装了less的话 则加上/deep/
/deep/.ant-table-body::-webkit-scrollbar { /* 滚动条整体样式 */ width: 6px; /* 宽高分别对应横竖滚动条的尺寸 */ background: rgb(235, 238, 245); border-radius: 10px; -webkit-box-shadow: inset 1px 0 1px rgba(0,0,0,0.2); } /deep/.ant-table-body::-webkit-scrollbar-thumb { /* 滚动条里的小方块 */ border-radius: 3px; background: #2e4a89; height: 120px; } /deep/.ant-table-body::-webkit-scrollbar-track { /* 滚动条里面的轨道 */
-webkit-box-shadow: inset 0 0 5px rgba(0,0,0,0.2); border-radius: 10px; background: rgba(0,0,0,0.1); }
可以在类名前面添加/deep/