Question

我正在为SCSS构建一个mixin我想知道它可以根据参数添加一个aditional值。这就是我尝试过的。一切正常，但@if条件：

@mixin fontFace( $fontName, $path: "", $weight: normal, $style: none, $fileName: $fontName, $svg:0 ) {
    @font-face {
      font-family: $fontName;
        src: url("#{$path}#{$fileName}.eot");
        src: url("#{$path}#{$fileName}.eot?iefix") format("eot"), 
                 url("#{$path}#{$fileName}.woff") format("woff"),
                 url("#{$path}#{$fileName}.ttf") format("truetype")
                 @if $svg != 0 {
                    , url("#{$path}#{$fileName}.svg##{$fileName}") format("svg");
                 }else{
                    ;
                 }
      font-weight: $weight;
      font-style: $style;
    }
}

Answer 1

以下内容如何：

@mixin fontFace( $fontName, $path: "", $weight: normal, $style: none, $fileName: $fontName, $svg: false ) {
    $src: url("#{$path}#{$fileName}.eot?iefix") format("eot"), 
          url("#{$path}#{$fileName}.woff") format("woff"),
          url("#{$path}#{$fileName}.ttf") format("truetype");

    @if $svg == true {
        $src: $src, 
                url("#{$path}#{$fileName}.svg##{$fileName}") format("svg");
    }

    @font-face {
        font-family: $fontName;
        src: url("#{$path}#{$fileName}.eot");
        src: $src;
        font-weight: $weight;
        font-style: $style;
    }
}

SCSS：多个CSS语句中间的条件

1 个答案: