uniapp css无法显示进度条的问题解决

最近在开发uniapp页面时 发现即使写了css overflow: scroll强制显示滑动进度条 依然没有显示,想了想,肯定是官方的样式表做了相应的处理。果然一检查,在全局样式发现了:

::-webkit-scrollbar {

display: none;

}

因此,要想显示进度条,我们需要自己稍加修改:

&::-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;
	}
相关推荐
小满zs12 小时前
关于HBuilderX+ 微信小程序开发工具启动的问题
前端·uni-app
feixing_fx12 小时前
告别枯燥字体:Web 字体加载策略与 font-display 最佳实践
前端·css·前端框架·交互·css3
ly768916 小时前
CSS 从入门到进阶:系统掌握现代网页样式与布局
前端·css
前端技术官17 小时前
一行 CSS 新特性干掉 20 行 JavaScript ?
css·滚动驱动动画·容器查询·:has()·anchor positioning
sunphp开发者19 小时前
制作手绘地图瓦片切图
前端·uni-app
Beginner x_u20 小时前
Tailwind CSS 速通:有 CSS 基础的实战入门
css·tailwindcss·工程化
WL_arm2 天前
Vibe Coding(氛围编程)入门
javascript·css·人工智能·html5
梦曦i2 天前
RouterLink v2.5.0:H5端原生能力全面回归
前端·uni-app
码农刚子2 天前
用 .NET 8 + uni-app 做一套多租户畜牧 SaaS:我们在秦巴牧云踩过的 6 个坑
uni-app·.net·saas
PedroQue992 天前
RouterLink v2.5.0:H5端原生能力全面回归
前端·uni-app