如何在sass / scss中转义字符串css?

时间:2022-12-22 19:33:21

I have a string that contain a css value and I want to use it but with gruntjs return me an error

我有一个包含css值的字符串,我想使用它,但是使用gruntjs会给我一个错误

Syntax error: Invalid CSS after "   @media ": expected media query (e.g. print, screen, print and screen), was "$from-smartphon..."

this is my var

这是我的变种

$from-smartphone-portrait:         "only screen and (min-width: 1px)";

and this is how I call it:

这就是我所说的:

    @media $from-smartphone-portrait {
        // Smartphone portrait
        body {
            font-size: 12px;
            line-height: 14px;
        }
    }

in LESS I can escape it in this mode:

在LESS我可以在这种模式下逃脱:

@from-smartphone-portrait:         ~"only screen and (min-width: 1px)";

How can I make the same thing in SASS/SCSS?

我怎样才能在SASS / SCSS中做同样的事情?

Thanks

1 个解决方案

#1


19  

You can make use of the unquote function:

您可以使用unquote函数:

$from-smartphone-portrait: unquote("only screen and (min-width: 1px)");

To use the variable for the media query definition:

要将该变量用于媒体查询定义:

@media #{$from-smartphone-portrait} {

#1


19  

You can make use of the unquote function:

您可以使用unquote函数:

$from-smartphone-portrait: unquote("only screen and (min-width: 1px)");

To use the variable for the media query definition:

要将该变量用于媒体查询定义:

@media #{$from-smartphone-portrait} {