SCSS 问题，适用于 fiddle 但不适用于本地

Question

我一直在寻找一种 CSS 做之字形边界的唯一方法，过了一会儿我在 codepen 上找到了这个例子，这里 http://codepen.io/anon/pen/artDy，但它不包括透明度，并且所以我决定修改它，并得出了在该在线资源上完美运行的代码（您可以尝试将其粘贴到 link，然后查看我的自定义）：

@mixin border-top-serrated($size, $color-outer) {
& {
    position: relative;
    padding-top: $size;
}  
&:before {
    top: 0px;
    @include background(linear-gradient(-135deg, $color-outer $size / 2, transparent 0), linear-gradient(135deg, $color-outer $size / 2, transparent 0));
    @include border-serrated-helper($size, $color-outer);
}}
@mixin border-bottom-serrated($size, $color-outer) {
& {
    position: relative;
    padding-bottom: $size;
}
&:after {
    bottom: -30px;
    background-position: right top;
    @include background(linear-gradient(4545deg, $color-outer $size / 2, transparent 0), linear-gradient(-4545deg, $color-outer $size / 2, transparent 0));
    @include border-serrated-helper($size, $color-outer);
}}
@mixin border-serrated-helper($size, $color-outer) {
content: " ";
display: block;
position: absolute;
left: 0px;
width: 100%;
height: $size;
background-repeat: repeat-x;
background-size: $size $size;}

.serrated {
background: #dddccf;
color: #aca8a1;
text-align: center;
@include border-bottom-serrated(32px, rgba(255, 0, 0, 0.3) );}

但是当我在一个普通的 SCSS 文件上使用它时，我的 SCSS 转换器告诉我有一个未定义的 mixin background。现在，我发现实际上 mixin background 没有在任何地方定义。

我怎样才能让它工作？

Answer 1

在线笔正在使用名为 bourbon 的 mixin 库，它提供了笔中使用的 background mixin。您可以安装 bourbon ruby gem，然后将库导入 scss 文件。

SCSS 问题，适用于 fiddle 但不适用于本地

SCSS issue, works on fiddle but not on local

css

sass

mixins