css - 不透明度的 SASS 变量

Question

我正在尝试让我的 killer 叠加层稍微更可控，所以我想知道我是否可以做类似的事情:

.item-caption {
    background: rgba($red, $green, $blue, 0.$slider_text_background_opacity);
    text-align: center;
    color: #fff;
}

第一个红色绿色和蓝色都工作得很好，当我添加 opactiy tho 时，它不再做任何事情了。还留下 0. 并将整个变量放在那里似乎无法正常工作..有什么建议吗？

Answer 1

所以你最后一个变量是错误的。你不能像

这样把值放在一起

0.$slider_text_background_opacity

但是如果你做类似的事情

$slider_text_background_opacity: 0.5

然后像这样将它放入 rgba 函数中:

background: rgba($red, $green, $blue, $slider_text_background_opacity);

有效。

工作 fiddle :https://jsfiddle.net/swchkt62/