【问题标题】:Sass 3.4 Removing forward slash on a stringSass 3.4 删除字符串上的正斜杠
【发布时间】:2014-09-30 02:49:04
【问题描述】:

是否有解决方法或任何其他方法可以使其在 Sass 3.4 + 上工作

@mixin icon ($name, $code) {
.#{$name}::before {
content: str-slice("\x",1,1) + $code;}
}

@include icon('test', 4556);

代码应该输出

.test::before { 内容:“\4556”; }

但是在 3.4+ 上,\ 斜杠被删除并输出为

.test::before { 内容:“x4556”; }

谢谢

【问题讨论】:

    标签: sass compass


    【解决方案1】:

    您偶然发现了currently-debated issue with escape characters in Sass。目前看来,Sass 要么添加太多字符,要么最终将 unicode 字符放入输出 css。

    更新:

    @mixin icon ($name, $code) {
      $withslash: "\"\\#{$code}\"";
      .#{$name}:before {
        content: unquote($withslash);
      }
    }
    @include icon('test', '4556');
    

    输出

    .test:before {
      content: "\4556";
    }
    

    http://sassmeister.com/gist/04f5be11c5a6b26b8ff9

    显然,这种方法的缺点是它依赖于使用转义字符做奇怪的事情并欺骗 Sass 取消对可能格式错误的字符串的引用。

    【讨论】:

    • 您好,谢谢,但斜线方向错误,需要向前而不是向后。 \
    • “奇怪的东西”+1 亿哇。让我想起了很多 IE 的 Holly Hack。我希望语言可以自行解决。这不利于吸引开发者。
    • 您,先生,是我的英雄。已经为此苦苦挣扎了几个小时。
    【解决方案2】:

    或者,您可以使用辅助函数从字符串中删除空格:

    @function nospaces($str) {
      @while (str-index($str, ' ') != null) {
        $index: str-index($str, ' ');
        $str: "#{str-slice($str, 0, $index - 1)}#{str-slice($str, $index + 1)}";
      }
      @return $str;
    }
    

    那么函数应该是这样的:

    @mixin icon ($name, $code) {
      .#{$name}:before {
        content: nospaces("\ #{$code}");
      }
    }
    
    @include icon('test', '4556');
    

    或不加引号:

    @mixin icon ($name, $code) {
      .#{$name}:before {
        content: nospaces(\ #{$code});
      }
    }
    
    @include icon('test', '4556');
    

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2012-07-18
      • 2015-03-28
      • 1970-01-01
      相关资源
      最近更新 更多