修改LESS变量的Alpha不透明度


171

使用LESS,我知道可以更改颜色变量的饱和度或色调。看起来像这样:

background: lighten(@blue, 20%);

不过,我想更改颜色的Alpha不透明度。最好像这样:

background: alpha(@blue, 20%);

在LESS中有简单的方法可以做到这一点吗?

Answers:


303

网站的文件给出了答案:

background: fade(@blue, 20%);

函数名称与该文档fade不符alpha


谢谢!我已经厌倦了将所有内容转换为RGBA!
BillyNair

我正在寻找变暗和变亮.. Docs带我到那里。谢谢

1
我同意“淡入淡出”对我而言似乎并不准确。Sass做对了:alpha(),opacity()和rgba()。
Rich Finelli

2
出于记录,fade()不适用于CSS变量-即fade(var(--mycolor), 20%)
ed1nh0

26

为了完整性

褪色

设置颜色的绝对透明度。可以将其应用于颜色,无论它们是否已经具有不透明度值。

background: fade(@blue, 20%);

淡入

降低颜色的透明度(或增加不透明度),使其更不透明。

background: fadein(@blue, 80%);

消退

增加颜色的透明度(或减少不透明度),使其不透明性降低。要在另一个方向上淡入淡出,请使用淡入。

background: fadeout(@blue, 20%);

查看完整的文档


1
淡出正是我想要的,谢谢!
maxime1992年
By using our site, you acknowledge that you have read and understand our Cookie Policy and Privacy Policy.
Licensed under cc by-sa 3.0 with attribution required.