css - 用于在不透明度/RGBA 之后确定颜色的 Sass/Compass Mixin

Question

我正在使用 rgba mixin像 rgba('#2f305a',0.8)，效果很好，但我想更进一步。我需要使不透明后的颜色看起来像纯色一样。我以为我看到了一个函数，不久前就这样做了，但似乎无法找到它。我们那里有吗？有人有吗？我尝试转换 this并这样做:

@function alphaCalc($desiredColour, $desiredAlpha, $backgroundColour: white) {
    $r3: red($desiredColour);
    $g3: green($desiredColour);
    $b3: blue($desiredColour);

    $r2: red($backgroundColour);
    $g2: green($backgroundColour);
    $b2: blue($backgroundColour);

    $r1: ($r3 - $r2) / $desiredAlpha + $r2;
    $g1: ($g3 - $g2) / $desiredAlpha + $g2;
    $b1: ($b3 - $b2) / $desiredAlpha + $b2;

    @return rgba($r1, $g1, $b1, $desiredAlpha);
}

.someEl {
    background-color: alphaCalc(#2f305a,0.8);
}

问题是我得到一个错误:"$red: 'rgba' 的颜色值 -5 必须在 0 到 255 之间"

r3 = 47; r2 = 255; r1 = (47-255)/0.8+255 = -5

看来公式不对，还是我遗漏了什么？有人有解决方案吗？

Answer 1

为确保您始终使用正数，您需要使用 abs() 函数:

@return rgba(abs($r1), abs($g1), abs($b1), $desiredAlpha);