注册登录

3***@qq.com

3***@qq.com

发布：2020-05-12 17:48
更新：2023-02-08 11:04
阅读：6044

uniapp 发布成微信小程序 css 不支持 var设置动态样式

分类：uni-app

uniapp , css使用var设置动态样式，如下代码，在 H5模式运行，没有问题，在微信小程序模式运行，无效，圆饼显示不出来。将样式中的 var(--xxx) 替换成固定值，微信小程序可以显示圆饼。确认是 css var 在微信小程序模式存在问题
<style>
.pie {
width: var(--pieSize);
height: var(--pieSize);
border-radius: 50%;
background: var(--pieBColor);
background-image: var(--pieColor);
}
</style>

在h5模式下的效果：

在微信模式下的效果：

代码：

2020-05-12 17:48 负责人:无分享

4 个回复

社交软件联盟 - 免费的社交软件开发框架和运营支持合作联盟

遇到了同样的问题，

此操作在uniapp 微信小程序上不生效

https://blog.csdn.net/qq_41635167/article/details/103899769

换成kekbeb-case命名试试

Mi六

非常感谢

2021-04-09 09:19
2***@qq.com

回复 Mi六: 请问这个问题解决了吗

2023-08-08 10:44

1***@qq.com

想问问现在有啥办法解决了吗

enderX

换成kekbeb-case命名试试

2021-08-26 19:26
1***@qq.com

回复 enderX: kekbeb-case命名是啥意思，有具体的写法吗哥

2021-08-30 11:17
enderX

回复 1***@qq.com: BaseButton -> base-button

2021-08-30 11:58
enderX

--pieColor -> --pie-color

2021-08-30 11:58

6***@qq.com

--baRtop换成--bar-top 如果还不生效，还有一个原因是添加的属性没有响应功能，需要使用$set

该问题目前已经被锁定, 无法添加新回复