在 Stylus 中将 HEX 转换为 RGBA答案

【问题标题】：Convert HEX to RGBA in Stylus在 Stylus 中将 HEX 转换为 RGBA
【发布时间】：2013-12-31 02:04:09
【问题描述】：

我在 Stylus 中有一些类似于以下的 HEX 颜色值

$my-background ?= #123456
$my-foreground ?= #ABCDEF

并希望在 rgba 值中使用它们来实现不透明度，以便

.my-class
    background rgba($my-background, .5)
    foreground rgba($my-foreground, .5)

或者另一种语法被编译成 CSS

.my-class {
    background rgba(18, 52, 86, .5);
    foreground rgba(171, 205, 239, .5);
}

有没有一种使用 Stylus 或 Stylus 插件（例如 nib）在 rgba 中使用 HEX 颜色值的快速简便的方法？

【问题讨论】：

标签： stylus

【解决方案1】：

最后我做了我自己的功能来做到这一点：

hextorgba(color, alpha = 1)
    'rgba(' + red(color) + ', ' + green(color) + ', ' + blue(color) + ', ' + alpha + ')'

【讨论】：

【解决方案2】：

其实Stylus中的rgba就是这样工作的，你写的有试过吗？在手写笔中

$my-background ?= #123456
$my-foreground ?= #ABCDEF

.my-class
    background rgba($my-background, .5)
    foreground rgba($my-foreground, .5)

实际上会编译成

.my-class {
  background: rgba(18,52,86,0.5);
  foreground: rgba(171,205,239,0.5);
}

这意味着您可以直接执行rgba(black, 0.5)、rgba(#FFF, 0.5) 之类的操作，并在其中使用变量，就像您的情况一样。

【讨论】：