less 如何与css var一起使用？

• Z时代
• 2024-02-18
• 分类：IT

比如我想这么用

会报错

how to fix this?

回答：

var() 取得时运行时变量，你这里需要的是一个编译是变量而不是表达式（已知常量），当然不能这样用，因为在编译的时候还不知道这个的值是什么。

回答：

由于在编译时 Less 并不清楚 CSS 变量的值，所以没法计算结果值。

body {
  --pirmary-color: #f00;
}
@primary: tint(var(--pirmary-color), 20%); // 报错

CSS 变量作为最终想在页面上使用的目标变量，在这之前要进行换算什么的都可以通过 Less 变量来进行，最后再赋值给 CSS 变量进行使用。

// 变量申明和计算
@pre-primary-color: #f00;
body {
  --pirmary-color: tint(@pre-primary-color, 20%);
}
@primary: var(--pirmary-color);
// 使用
div {
  color: @primary;
}

以上是 less 如何与css var一起使用？ 的全部内容， 来源链接： utcz.com/p/935427.html