Question

我正在编写一个mixin，可以在一行中轻松添加多种字体。在mixin中，我写下我想要使用的所有权重：

$font-weights: (
"hairline": 100,
"thin": 200,
"light": 300,
"regular": 400,
"medium": 500,
"semibold": 600,
"bold": 700,
"heavy": 800,
"black": 900,   
);
$main-font: "Lato";
@include font-list($main-font,Hairline Thin Light Regular Medium SemiBold Bold Heavy Black, normal, $font-weights);

@include中给出的权重列表中的最后一个权重是“黑色”，所有链接都很顺利，但我使用的mixin给出了最后一个值的错误，因为它在某种程度上会自动转换为“黑色”在使用之前已经＃000000。

有没有办法让Sass不这样做？

Mixin（s）：

@mixin font-include($name, $file, $weight, $type) {
    @include font-face("#{$name}", font-files("#{$file}.woff", "#{$file}.ttf"), "#{$file}.eot", $weight, $type);
}

@mixin font-list($name,$weights,$type,$font-weight){
    @for $i from 1 through length($weights) {       
        @include font-include($name,#{$name}-#{nth($weights,$i)},map-get($font-weight,#{to-lower-case(nth($weights,$i))}),$type);
    }
}

指南针给出的错误是：

 $string: #000000 is not a string for `to-lower-case'

Answer 1

使用所有权重的mixin中的unquote修复它。

（并为Italic字体添加了功能）。

@mixin font-list($name,$weights,$type,$font-weight){
    $italic: '';
    @if $type == 'italic'{  
        $italic: 'Italic';
    }
    @for $i from 1 through length($weights) {   
        $weight: unquote("#{nth($weights,$i)}");
        @include font-include($name,#{$name}-#{nth($weights,$i)}#{$italic},map-get($font-weight,#{to-lower-case($weight)}),$type);
    }
}

Sass将黑色自动转换为＃000000

1 个答案: