LESS - 颜色定义函数

描述

LESS 提供了许多有用的颜色函数,以不同的方式改变和操纵颜色。LESS 支持一些颜色定义函数,如下表所示 −

Sr.No. 函数和描述 示例
1

rgb

它从红色、绿色和蓝色值创建颜色。它具有以下参数 −

  • red −它包含 0 - 255 之间的整数或 0 - 100% 之间的百分比。

  • green − 它包含 0 - 255 之间的整数或 0 - 100% 之间的百分比。

  • blue − 它包含 0 - 255 之间的整数或 0 - 100% 之间的百分比。

rgb(220,20,60)

它将 rgb 值的颜色转换为 −

#dc143c
2

rgba

它根据红色、绿色、蓝色和 alpha 值确定颜色。它具有以下参数 −

  • red − 它包含 0 - 255 之间的整数或 0 - 100% 之间的百分比。

  • green − 它包含 0 - 255 之间的整数或 0 - 100% 之间的百分比。

  • blue − 它包含 0 - 255 之间的整数或 0 - 100% 之间的百分比。

  • alpha −它包含 0 - 1 之间的数字或 0 - 100% 之间的百分比。

rgba(220,20,60, 0.5)

它将具有 rgba 值的颜色对象转换为 −

rgba(220, 20, 60, 0.5)
3

argb

它以 #AARRGGBB 格式定义颜色的十六进制表示。它使用以下参数 −

  • color − 它指定颜色对象。

argb(rgba(176,23,31,0.5))

它将 argb 颜色返回为 −

#80b0171f
4

hsl

它根据色调、饱和度和亮度值生成颜色。它具有以下参数 −

  • hue(色调) − 它包含 0 - 360 之间的整数,代表度数。

  • saturation(饱和度) − 它包含 0 - 1 之间的数字或 0 - 100% 之间的百分比。

  • lightness(亮度) − 它包含 0 - 1 之间的数字或 0 - 100% 之间的百分比。

hsl(120,100%, 50%)

它使用 HSL 值返回颜色对象 −

#00ff00
5

hsla

它根据色调、饱和度、亮度和 alpha 值生成颜色。它具有以下参数 −

  • hue(色调) − 它包含 0 - 360 之间的整数,代表度数。

  • saturation(饱和度) − 它包含 0 - 1 之间的数字或 0 - 100% 之间的百分比。

  • lightness(亮度) − 它包含 0 - 1 之间的数字或 0 - 100% 之间的百分比。

  • alpha −它包含 0 - 1 之间的数字或 0 - 100% 之间的百分比。

hsla(0,100%,50%,0.5)

它使用 HSLA 值作为 − 指定颜色对象

rgba(255, 0, 0, 0.5);
6

hsv

它根据色调、饱和度和值生成颜色。它包含以下参数 −

  • hue(色调) −它包含 0 - 360 之间的整数,代表度数。

  • saturation(饱和度) − 它包含 0 - 1 之间的数字或 0 - 100% 之间的百分比。

  • value(值) − 它包含 0 - 1 之间的数字或 0 - 100% 之间的百分比。

hsv(80,90%,70%)

它将颜色对象与 hsv 值转换为 −

#7db312
7

hsva

它从色调、饱和度、值和 alpha 值产生颜色。它使用以下参数 −

  • hue(色调) − 它包含 0 - 360 之间的整数,代表度数。

  • saturation(饱和度) − 它包含 0 - 1 之间的数字或 0 - 100% 之间的百分比。

  • value(值) −它包含 0 - 1 之间的数字或 0 - 100% 之间的百分比。

  • alpha − 它包含 0 - 1 之间的数字或 0 - 100% 之间的百分比。

hsva(80,90%,70%,0.6)

它指定颜色对象,其中 hsva 值如下 −

rgba(125, 179, 18, 0.6)