如何在SASS中引用字符串？

Question

我正在使用SASS生成@ font-face mixin,但是这样:

=remotefont(!name, !url)
  @font-face
    font-family = !name
    src = url(!url + ".eot")
    src = local(!name), url(!url + ".ttf") format("truetype")

+remotefont("My font", "/myfont.ttf")

成为这个:

@font-face {
  font-family: My font;
  src: url(/myfont.ttf.eot);
  src: local(My font), url(/myfont.ttf.ttf) format(truetype); }

无论我尝试多少,我都不能引用"我的字体"(带"!name")或"truetype"(它删除引号).有关如何做到这一点的任何想法？

Answer 1

使用字符串插值可以做得更好:

!name = "asdf"
.foo
  font-family = "\"#{!name}\""

但我同意我们需要一种更好的方法来处理sass中的引用字符串.Sass有足够的上下文在这里做一些聪明的事情而不是将引用逻辑卸载给用户.

Answer 2

您可以引用变量,在双引号内使用单引号.我是这样做的:

!string = "'Myriad Pro', 'Lucida Sans', Helvetica, Arial, sans-serif"
.foo
  :font-family= !string

这将正确编译为:

.foo{
  font-family: 'Myriad Pro', 'Lucida Sans', Helvetica, Arial, sans-serif; }

我认为你不能反过来引用(即单引号内的双引号).这样做会给你编译错误.

希望有所帮助!