uniapp设置滚动条overflow不生效

1,441 阅读1分钟

在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;
}

滚动条选择器

  1. ::-webkit-scrollbar — 整个滚动条.
  2. ::-webkit-scrollbar-button — 滚动条上的按钮 (上下箭头).
  3. ::-webkit-scrollbar-thumb — 滚动条上的滚动滑块.
  4. ::-webkit-scrollbar-track — 滚动条轨道.
  5. ::-webkit-scrollbar-track-piece — 滚动条没有滑块的轨道部分.
  6. ::-webkit-scrollbar-corner — 当同时有垂直滚动条和水平滚动条时交汇的部分.
  7. ::-webkit-resizer — 某些元素的corner部分的部分样式(例:textarea的可拖动按钮)