[toc] ## transparent IE9+開始支持`color:transparent` ## currentColor ``` .test{ color:red; border:2px solid; } ``` 這里的border省略了顏色值的設置，這個顏色值會和color值一個顏色 它相當于這么設置 ``` .test{ color:red; border:2px solid currentColor; } ``` ## hsl,hsla IE9+開始支持 hsl顏色的3個字母有著自己的含義，其中 h表示`hue`，色調的意思。取值0~360，大致按照數值紅、橙、黃、綠、青、藍、紫變化 s表示`saturation`，飽和度的意思，用0~100%表示，值越大飽和度越高，顏色越亮，通常我們評價某設計"亮瞎我們的眼"，就是這個設計顏色飽和度太高 l表示`lightness`，亮度的意思，也用0~100%表示，值越高顏色越亮，100%就是白色，**50%則是正常亮度**，0%就是黑色。 hlsa則是再多了一個alpha透明通道 ### 區分飽和度和亮度 飽和度越低，世界越趨向于不是黑就是白的世界 亮度越低，黑色成分越多（越暗），反之白色成分越多(越亮)