这可能是指南针101,但有人写过一个混音设置 colored颜色 的阿尔法值吗?理想情况下,我希望mixin采用任何形式的 colored颜色 定义,并应用透明度:

@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);

推荐答案

使用rgba function built into Sass

设置 colored颜色 的不透明度.

示例:

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

参数:
( colored颜色 ) colored颜色
(数字)alpha-介于0和1之间的数字

返回:

代码:

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

Css相关问答推荐

在菜单中最后一项之后排除MUI分隔符

为什么我不能编辑垫按钮填充?

如何将表格单元格的最后一个子级与单元格底部对齐?

如何在JavaFX中设置分隔符的样式?

如何将下拉面板放置在MAT-SELECT文本框的正下方

Nuxt 3+sass:不能将包含路径与@IMPORT和@USE一起使用

使用SVG以竖排书写模式创建渐变文本时,文本显示异常

Bootstrap 和 Sass:将 SCSS 文件转换为 CSS 时出错.错误:$theme-colors-rgb 中未定义变量 @each $color、$value

Puppeteer - 无法在wine 店网站中拉出正确的 CSS Select 器

我可以拆分我的 CSS / SASS webpack 加载器规则,还是它们需要成为一个大规则?

Nativewind 的某些样式不适用于本机 (Android),但它们适用于网络

如何在 Tailwind 中使用 `margin: y x;` 速记?

子组件的css会影响整个页面

未知规则 @propertycss(unknownAtRules)

nth-child 在一个页面上工作,但不在另一个页面上

CSS 中的区域类似于 C# 区域?

使用 JavaScript 将 CSS 添加到 ?

如何防止内联块 div 换行?

可见性:隐藏 vs 显示:无 vs 不透明度:0

仅使用 css 的换行符(如
)