Ruby on rails 更少的CSS预处理器：有没有办法将单一颜色映射到rgb和rgba定义？

我正在尝试在CSS预处理器中编写一个块，它将执行以下操作：

@transparent_background(@color; @alpha: .8)
{
  background: @color;
  background: rgba(<color R value>, <color G value>, <color B value>, @alpha);
}

试试这个：

background: @color - rgba(0, 0, 0, 1.0) + rgba(0, 0, 0, @alpha);

减法将清除

@color

上的alpha通道，然后您只需将所需的

@alpha

添加到alpha通道。颜色具有全套操作符，当在两种颜色上操作时，它们会逐个组件地工作；颜色在内部存储为RGBA组件，因此应该可以正常工作。此外，alpha通道标准化为间隔

[0，1.0]

，因此从alpha通道中减去1.0应该可以清除它，而不会导致任何问题

---

我现在没有设置CSS LESS，所以我无法检查，但这值得一试。

所有解决方案都不再有效，但这一个可以（感谢）：

---

hsla（）

功能虽然未在LESS网站上公布，但已定义。

请注意，您也可以继续使用LESS的fadein/fadeout功能：

.alpha(@color, @alpha: 80)
{
    background-color: fadeout(@color, (100 - @alpha));
}

---

因此，.alpha（红色，25）将导致背景色为rgba（255，0，0，0.25）

我知道这是一个老问题，但如果您只想添加一个alpha值，只需使用

淡入（@color，@alpha）

。颜色可以是十六进制、rgba或hsla。

因为@Color只是一个十六进制定义，所以不需要先减去alpha通道。所以解决方案很简单：@color+rgba（0,0,0,alpha）。回想起来似乎很明显，但我没有意识到你可以像那样混合使用十六进制/rgba。我只是有点偏执，试图证明阿尔法通道修改的未来性，因此，通过减法将alpha通道强制进入已知状态，以便将

@alpha

添加到它将导致alpha通道等于

@alpha

。作为一个额外的好处，它使您更清楚地分配alpha通道，而不仅仅是对其进行一点调整。至少在LESSHPP中，没有任何检查来防止alpha通道变为负值。真的吗？如果我使用LESSHPP，我会修复它并提交补丁。负alpha没有多大意义（可能是“用黑色蜡笔使劲按”？），而规范的Ruby实现将alpha限制为

[0,1]

。OTOH，这说明了在没有正式规范的情况下工作的问题。+1，很好！附言：我绝对喜欢新的安全性较低的混音D

.alpha(@color, @alpha: 0.8) {
    color: @color;
    color: hsla(hue(@color), saturation(@color), lightness(@color), @alpha);
}

.alpha(@color, @alpha: 80)
{
    background-color: fadeout(@color, (100 - @alpha));
}