css - SASS 元素\用 CSS 编写

Question

我对 SASS 有点迷茫。

我正在为 Fontello 开发 mixin，但它使用\符号将代码转换为图标。

如何将这个标志从 SASS 写入 CSS？

例子:

我在 map 上有图标:

$fontello-icon: (
    facebook-rect: \e800,
    facebook: \e801
);

并使用此语句将它们写下来:

&:after
  content: '#{map-get($fontello-icon, facebook)}'

但是 css 看起来像:

h1:after {
  content: "\\e801";

取而代之的是:

h1:after {
  content: "\e801";

有人可以帮我解决这个问题吗？

Answer 1

只是为了添加到@Mark 答案并提供一些上下文，请在您的编译器中尝试此代码:

$a: \e801;
$b: '\e801';
@debug $a;
@debug '#{$a}';
@debug $b;
@debug '#{$b}';

记录的输出将是:

/style.scss:3 DEBUG: \e801 // <- Terminal has displayed the escaped `\\` as `\` (as appropriate for a program)
/style.scss:4 DEBUG: \e801 // <- Same as above
/style.scss:5 DEBUG: (A unicode character that I could not copy in)
/style.scss:6 DEBUG: (A unicode character that I could not copy in)

原因是 SASS - 或任何编程语言(除了 Apple 的 swift 如果我没记错的话 - 它们可以在任何地方使用 unicode) - 除了 inside 字符串(和即使这样它也只支持表示而不支持实际字符)。因此，当您声明 unicode 字符串而不使其成为字符串时，假定 只是它们自己的字符，就像单词 sheep 只是 [s, h,e,e,p] 和 \e801 只是 [\,e,8,0,1] - 你想要的输出是 [\e801]。所以将你的 unicode 存储在字符串中是一般的想法。