CSS hsl() 函数
实例
定义不同的 HSL 颜色
#p1 {background-color:hsl(120,100%,50%);} /* 绿色 */
#p2 {background-color:hsl(120,100%,75%);} /* 浅绿色 */
#p3 {background-color:hsl(120,100%,25%);} /* 深绿色 */
#p4 {background-color:hsl(120,60%,70%);} /* 淡绿色 */亲自试一试 »定义和用法
hsl() 函数使用色相-饱和度-亮度 (HSL) 模型定义颜色。
HSL 代表色相、饱和度和亮度，它代表了颜色的圆柱坐标表示。
| 版本 | CSS3 |
|---|
浏览器支持
表中数字表示该函数完全支持的第一个浏览器版本。
| 函数 | |||||
|---|---|---|---|---|---|
| hsl() | 1.0 | 9.0 | 1.0 | 3.1 | 9.5 |
CSS 语法
hsl(色相, 饱和度, 亮度)
| 值 | 描述 |
|---|---|
| hue | 定义色轮上的角度（从 0 到 360）- 0（或 360）是红色，120 是绿色，240 是蓝色 |
| saturation | 定义饱和度；0% 是灰色调，100% 是全彩（完全饱和） |
| 亮度 | 定义亮度；0% 是黑色，50% 是正常，100% 是白色 |
