颜色的表示#

直接使用颜色对应的英文单词,编写比较简单。

1.fontColor {
2  color: red; /* 红色 */
3}

使用 红、绿、蓝 这三种光的三原色进行组合。

• r ：红色（ red ）
• g ：绿色（ green ）
• b ：蓝色（ blue ）
• a ：透明度（ alpha ）

1/* rgb */
2.fontColor {
3  color: rgb(255, 0, 0); /* 红色 */
4}
5
6/* rgba */
7.fontColor {
8  color: rgba(255, 0, 0, 0.5); /* 半透明红*/
9}

HEX 原理和 rgb 一样,依然通过：红、绿、蓝 进行组合,只不过要用 6 个数字,分成 3 组来表达。

格式为：#rrggbb

每一位数字的取值范围是：0~f,即 ( 0 , 1 , 2 , 3 , 4 , 5 , 6 , 7 , 8 , 9 , a , b , c , d , e , f ) 。

所以每一种光的最小值是：00 ,最大值是：ff

1.fontColor {
2  color: #ff0000; /* 红色 */
3}

HSL 是通过：色相、饱和度、亮度,来表示一个颜色,格式为：hsl(色相, 饱和度, 亮度)。

• 色相（hue）：取值范围是 0~360 度。

• 饱和度（saturation）：取值范围是 0%~100%。（向色相中对应颜色中添加灰色,0% 全灰,100% 没有灰）

• 亮度（lightness）：取值范围是 0%~100%。（0%亮度没了,所以就是黑色。100%亮度太强,所以就是白色了）

HSLA 其实就是在 HSL 的基础上,添加了透明度。

1.fontColor {
2  color: hsl(0deg, 100%, 50%); /* 红色 */
3}