将LESS mixins翻译成Sass

Question

嗯..我对LESS很熟悉，当我试图升级到SASS时。

我会用这种方式创建一些框架：

.w(@x){width:@x;}
.h(@x){height:@x;}
.f(@x,@y){font:@x '@y'}

我将它保存为framework.less并将@import保存在我的main.less

上

我刚刚搜索过，但我没有找到如何在SASS中做到这一点。只需阅读官方网站上的文档但没有成功。 任何人都可以解释我或给我一个教程链接吗？我在谷歌上找到的所有链接都有点难以理解，甚至使SASS工作。

LESS'文档很容易理解，但是SASS太复杂了。

Answer 1

这些被称为 mixins 。你会这样写：

@mixin w($x){width:$x;}
@mixin h($x){height:$x;}
@mixin f($x,$y){font:$x $y}

Mixin调用如下所示：

.foo {
    @include f(1.5em, sans-serif);
}

但是，您的f mixin有多余的参数：

@mixin f($x){font:$x}

.foo {
    @include f(1.5em sans-serif);
}