Question

如何使用SASS Lighten功能返回十六进制代码？

@function returnHexValue($color){
    @debug $color;
    @if $color == "white" {
        @return "#fff";
    }
    @if $color == "black" {
        @return "#000";
    }
    @return $color;
}

当我使用returnHexValue(lighten(#000,100%));之类的内容时，我仍然会将返回的值设为white而不是#fff。

Answer 1

您可以使用以下强制十六进制值的函数

@function force-hex($color) {
    @if type-of($color) == 'color' {
        $hex: str-slice(ie-hex-str($color), 4);
        @return unquote("\##{$hex}");
    }
    @return $color;
}

body{
  color: force-hex(lighten(#000,100%));
}

SASS github项目中几乎没有请求阻止将Hex转换为颜色值。您可以按照以下问题进行操作

https://github.com/sass/sass/issues/343 https://github.com/sass/sass/issues/363

使用SASS增亮功能返回Hex颜色代码

1 个答案: