目录

Less - 颜色通道功能( Color Channel Functions)

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

Sr.No. 功能说明
1

hue

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

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

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

background: 75;
2

saturation

在HSL颜色空间中,从颜色对象中提取饱和度通道。

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

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

background: 90%;
3

lightness

在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

red

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

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

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

background: 5;
8

green

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

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

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

background: 15;
9

blue

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

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

luminance

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

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

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

background: 78.53333333%;
↑回到顶部↑
WIKI教程 @2018