问题描述
我想用 Unicode 字符代码生成这个 CSS:
I want to generate this CSS with a Unicode character code:
.foo::before {
content: '\4556';
}
将单个(未转义的)反斜杠 (\
) 与代码(例如 4556
)连接起来.
Concatenating a single (unescaped) backslash (\
) with the code (e.g. 4556
).
主要条件是我不想提供已经带有反斜杠的 Unicode 代码(例如 \4556
),而是从整数生成它们.就像下面的混合:
With the main condition that I don't want to have to provide the Unicode codes already prepended with the backslash (e.g. \4556
) but to generate them from an integer for example. Like in the following mixin:
@mixin make-icon ($name, $code) {
.#{$name}::before {
content: '\#{$code}';
}
}
@include make-icon('foo','4556');
但是上面的 mixin 返回了这个 CSS:
However the above mixin returns this CSS:
.foo::before {
content: '\#{$code}'; }
我试过 '\\#{$code}'
, '\##{$code}'
, '/\#{$code}'
, '\/#{$code}'
, '\$code'
, '\\##{$code}'
并且它们都没有给出想要的结果.
I've tried '\\#{$code}'
, '\##{$code}'
, '/\#{$code}'
, '\/#{$code}'
, '\$code'
, '\\##{$code}'
and none of them gives the desired result.
甚至尝试将斜杠定义为变量并对其进行插值,但这也无济于事.
Even tried defining slash as a variable and interpolate it but that didn't help either.
知道如何解决这个问题吗?
Any idea how to solve this?
推荐答案
在 Sass v3.3 中,您可以通过使用新的 str-slice()
功能和做这样的事情:
In Sass v3.3 you can get around this problem by using the new str-slice()
function and doing something like this:
@mixin make-icon ($name, $code) {
.#{$name}::before {
content: str-slice("\x",1,1) + $code;
}
}
@include make-icon('foo', 4556);
应该输出:
.foo::before {
content: "\4556";
}
这篇关于如何在 Sass 中的字符串插值中使用单个反斜杠的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!