這個函數(shù)會顏色的飽和度值直接調(diào)至 0%,所以此函數(shù)與 desaturate($color,100%) 所起的功能是一樣的。一般這個函數(shù)能將彩色顏色轉(zhuǎn)換成不同程度的灰色。例如:
//SCSS
$baseColor: #ad141e;
.grayscale {
background: grayscale($baseColor);
}
.desaturate {
background: desaturate($baseColor,100%);
}
編譯出來的 css 代碼:
//CSS
.grayscale {
background: #616161;
}
.desaturate {
background: #616161;
}
看看計算出來的 HSL 各個值的變化:
>> hue(#ad141e) 356.07843deg >> hue(#616161) 0deg >> saturation(#ad141e) 79.27461% >> saturation(#616161) 0% >> lightness(#ad141e) 37.84314% >> lightness(#616161) 38.03922%
grayscale() 函數(shù)處理過的顏色,其最大的特征就是顏色的飽和度為 0。
小伙伴們,你們能說出下面運行出來的CSS代碼嗎?
請驗證,完成請求
由于請求次數(shù)過多,請先驗證,完成再次請求
打開微信掃碼自動綁定
綁定后可得到
使用 Ctrl+D 可將課程添加到書簽
舉報