uni-app progress进度条解决（标签设置圆角不生效，不支持渐变）

最新推荐文章于 2024-07-26 17:52:54 发布

青衫折扇

最新推荐文章于 2024-07-26 17:52:54 发布

阅读量4.1k

点赞数 2

分类专栏： uni-app 文章标签：前端

本文链接：https://blog.csdn.net/qq_42543264/article/details/124193843

版权

uni-app 专栏收录该内容

60 篇文章 17 订阅

订阅专栏

这篇博客分享了如何通过修改CSS样式，实现带有圆角和自定义线性渐变背景的uni-app进度条组件。代码示例中详细展示了如何应用这些样式，即使样式不生效，作者也提供了联系方式以便协助解决。鼓励读者关注作者的小程序以获取更多开源代码资源。

摘要由CSDN通过智能技术生成

先直接看效果

直接上代码

.uni-progress-bar {
		// 这主要是加上deep才能改变它原来的样式 
		border-radius: 10px !important;
		overflow: hidden;
	}
	
	.uni-progress-inner-bar {  
	    // 这主要是加上deep才能改变它原来的样式
	    border-radius: 10px !important;
	    overflow: hidden;
		background:linear-gradient(to right, #F137C8, #AA2AF9);
	}

如果不生效，可以通过小程序客服联系我

如果对你有用，关注一下博主的小程序，登录一下给予支持，以后有什么开源好用的源码都会上传到小程序