css - Sass/Compass - 将十六进制、RGB 或命名颜色转换为 RGBA

Question

这可能是 Compass 101，但是有没有人写过一个 mixin 来设置颜色的 alpha 值？理想情况下，我希望 mixin 采用任何形式的颜色定义，并应用透明度:

@include set-alpha( red, 0.5 );          //prints rgba(255, 0, 0, 0.5);
@include set-alpha( #ff0000, 0.5 );      //prints rgba(255, 0, 0, 0.5);
@include set-alpha( rgb(255,0,0), 0.5 ); //prints rgba(255, 0, 0, 0.5);

Answer 1

使用 rgba function built into Sass

Sets the opacity of a color.

Examples:

rgba(#102030, 0.5) => rgba(16, 32, 48, 0.5)
rgba(blue, 0.2) => rgba(0, 0, 255, 0.2)

Parameters:
(Color) color
(Number) alpha — A number between 0 and 1

Returns:
(Color)

代码:

rgba(#ff0000, 0.5); // Output is rgba(255,0,0,0.5);