LESS - 颜色通道功能

在本章中,我们将了解颜色通道功能在LESS中的重要性. LESS支持很少的内置函数,可以设置关于通道的值.通道根据颜色定义设置值. HSL颜色具有色调,饱和度和亮度通道,RGB颜色具有红色,绿色和蓝色通道.下表列出了所有颜色通道函数 :

Sr.No.功能&说明示例
1

色调

在HSL中颜色空间,色调通道从颜色对象中提取.

background :hue(hsl(75,90%,30%));

它在CSS中编译,如下所示 :

background :75;
2

饱和度

在HSL颜色空间中,提取饱和度通道关闭颜色对象.

background: saturation(hsl(75, 90%, 30%));

它在CSS中编译,如下所示 :

background :90%;
3

亮度

在HSL颜色空间中,提取亮度通道关闭颜色对象.

background:lightness(hsl(75,90) %,30%));

它在CSS中编译,如下所示 :

background :30%;
4

hsvhue

在HSV颜色空间中,提取色调通道关闭颜色对象.

background: hsvhue(hsv(75, 90%, 30%));

它在CSS中编译,如下所示 :

background :75;
5

hsvsaturation

在HSL颜色空间中,提取饱和度通道关闭颜色对象.

background: hsvsaturation(hsv(75, 90%, 30%));

它在CSS中编译,如下所示 :

background :90%;
6

hsvvalue

在HSL颜色空间中,提取值通道关闭颜色对象.

background: hsvvalue(hsv(75, 90%, 30%));

它在CSS中编译,如下所示 :

background :30%;
7

红色

红色通道从颜色对象中提取.

background:red(rgb(5,15,25));

它在CSS中编译,如下所示 :

background :5;
8

绿色

从颜色对象中提取绿色通道.

background:green(rgb(5,15,25));

它在CSS中编译,如下所示 :

background :15;
9

蓝色

从颜色对象中提取蓝色通道.

background:blue(rgb(5,15,25));

它在CSS中编译,如下所示 :

background :25;
10

alpha

从颜色对象中提取Alpha通道.

background:alpha(rgba(5,15,25,1.5) );

它在CSS中编译,如下所示 :

background :2;
11

luma

亮度值是根据颜色对象计算的.

background:luma(rgb(50,250,150));

它在CSS中编译,如下所示 :

background :71.2513323%;
12

亮度

亮度值是在没有伽马校正的情况下计算的.

background:brightness(rgb(50,250,150));

它在CSS中编译,如下所示 :

background :78.53333333%;