上一节:
下一节:

  Less 色彩通道函数

  • 定义和使用

    在这一章中，我们将了解色彩通道功能的重要性。LESS支持很少的内置函数来设置通道的值。通道根据颜色定义设置值。HSL颜色有色调、饱和度和亮度通道，RGB颜色有红色、绿色和蓝色通道。
    下表列出了所有颜色通道函数-
    序号 功能与说明 示例
    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
    在HSV颜色空间中，从颜色对象中提取色调通道。
    background:hsvhue(hsv(75, 90%, 30%));
    它在CSS中编译，如下所示-
    background: 75;
    4
    hsvhue
    在HSV颜色空间中，从颜色对象中提取色调通道。
    background: hsvhue(hsv(75, 90%, 30%));
    它在CSS中编译，如下所示-
    background: 75;
    5
    hsvsaturation
    它返回数字的平方根。
    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
    luma值的计算不需要gamma校正。
    background:luminance(rgb(50, 250, 150));
    它在CSS中编译，如下所示-
    background:78.53333333%;
    想了解更多颜色的知识，请阅读我们的颜色教程
上一节:
下一节: