在Sass中设置$primary-color的透明度

Question

88

在sass变量中，是否有在定义主色/次要色时包含颜色不透明度的选项？类似于lighten（$color, amount）函数的方式？

- Furi

2

你先尝试查找文档了吗？http://sass-lang.com/documentation/Sass/Script/Functions.html - cimmanon

1

opacify($color, 0.5) - Guy

1个回答

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- Zach Saucier · Accepted Answer

245

你可以使用 rgba，即...

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

它也适用于十六进制值

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

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

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

- Zach Saucier

7

好的，谢谢。这很有用，但不完全是我想要的。也许我表达的不够清楚，但我正在寻找一种将非不透明的主色调添加不透明度的方法。 - Furi

1

你能解释一下“主要颜色”是什么意思吗？可以提供一些示例代码吗？ - Zach Saucier

1

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

13

你可以像我说的那样使用 rgba：color:rgba($primary-color, .5)。 - Zach Saucier

2

这个解决了问题，非常感谢！ - Furi

显示剩余3条评论