在uniapp项目中,设置盒子的滚动条不生效,找了好久发现是因为全局css样式滚动条样式被隐藏了
::-webkit-scrollbar {
display: none;
}
如果单独想给元素开启滚动条该怎么使用呢,解决方法
我的是在scss中
&::-webkit-scrollbar {
display: block;
width: 3px;
}
&::-webkit-scrollbar-track {
background-color: rgba(241, 241, 241, 0.26);
}
&::-webkit-scrollbar-thumb {
background-color: #bfbfbf;
border-radius: 4px;
}
&::-webkit-scrollbar-thumb:hover {
background-color: #505518;
}
滚动条选择器
- ::-webkit-scrollbar — 整个滚动条.
- ::-webkit-scrollbar-button — 滚动条上的按钮 (上下箭头).
- ::-webkit-scrollbar-thumb — 滚动条上的滚动滑块.
- ::-webkit-scrollbar-track — 滚动条轨道.
- ::-webkit-scrollbar-track-piece — 滚动条没有滑块的轨道部分.
- ::-webkit-scrollbar-corner — 当同时有垂直滚动条和水平滚动条时交汇的部分.
- ::-webkit-resizer — 某些元素的corner部分的部分样式(例:textarea的可拖动按钮)