css主题的暗函数-错误:参数‘$ color’的‘Darken ($color，$amount)’必须是颜色
css主题的暗函数-错误:参数‘$ color’的‘Darken ($color，$amount)’必须是颜色
提问于 2018-05-30 11:22:53
我试图添加一个选项，以改变网站的颜色。所以，我有一个颜色字段，这是很好的工作，但问题是，我需要改变颜色10%更深，当鼠标悬停。函数暗表示第一个参数必须是颜色。
Error: argument `$color` of `darken($color, $amount)` must be a color我的代码如下：
:root {
--main-colour: #f06d06;
}
$colour-primary: var(--main-colour);
.btn {
background-color: $colour-primary;
&:hover {
background-color: darken($colour-primary, 10%);
}
}我需要可变的主颜色，因为这将被用来实时改变颜色。
有什么想法吗？
非常感谢
回答 5
Stack Overflow用户
回答已采纳
发布于 2018-05-30 11:43:32
var(--main-colour)是一个在运行时内插的CSS函数(因此它将在编译SCSS后解析)。SCSS是编译的，因此它的所有功能都是在运行之前计算的，不改变运行时.
代码中的问题之所以出现，是因为darken函数需要一个有效的颜色来执行计算，而且在编译期间，它得到的只是var(--main-colour)而不是颜色本身。(darken是一个SCSS函数，而不是一个CSS函数，因此不能更改它的运行时)。
Stack Overflow用户
发布于 2018-11-01 11:15:59
这个问题来自于靴带。
如果您使用的是一个框架(如function或angular )，请记住在变量之前导入函数。
@import 'functions';
@import 'variables';Stack Overflow用户
发布于 2020-04-26 06:10:32
已经回答了，不可能。然而，在某些情况下，filter: brightness(90%);可能是一种解决办法。有关CSS过滤器这里的更多信息。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/50612062
复制相关文章
相似问题
腾讯云开发者
