在 sass 中设置 $primary-color 的不透明度 [重复]

Posted 2023-03-06

【中文标题】在 sass 中设置 $primary-color 的不透明度 [重复]

【英文标题】：Setting opacity on $primary-color in sass [duplicate]

【发布时间】：2014-02-06 23:53:52

【问题描述】：

是否可以选择在您定义为 sass 变量中的主要/次要颜色的颜色中包含不透明度？以 lighten($color, amount) 函数的方式？

【问题讨论】：

您是否尝试先搜索文档？ sass-lang.com/documentation/Sass/Script/Functions.html

opacify($color, 0.5)

【参考方案1】：

你可以使用rgba，即

$primary: rgba(20,20,20, .5);

它也适用于十六进制值

$primary: rgba(#4B00B5, .3);

您还可以根据变量值设置颜色的不透明度。例如：

$primary-color: #a61723;
....
color: rgba($primary-color, .5);

Demo

【讨论】：

好的，谢谢，这很有用，但不完全是我想要的。也许我的问题表述有误，但我正在寻找一种方法来为非透明原色添加不透明度。

你能解释一下“原色”是什么意思吗，也许用一些示例代码？

例如我的原色设置为：$primary-color: #a61723;现在，当我在编写我的 CSS 并且我想在某个地方使用它并且我希望它具有一些不透明度时。有点像 lighten($primary-color, 10%)。我想知道这是否可以通过不透明度实现。

你使用rgba，就像我说的：color:rgba($primary-color, .5)

成功了，非常感谢！