小编Ste*_*ein的帖子

我想为box-shadow属性创建一个Sass mixin,但遇到了一些麻烦.一些现有代码看起来像这样.

#someDiv {
  -moz-box-shadow:0 0 5px rgba(0,0,0,.25);
}

#someOtherDiv {
  -moz-box-shadow:0 0 5px rgba(0,0,0,.25) inset;
}

#theLastDiv {
  -moz-box-shadow: 0 0 5px rgba(0,0,0,.25), 0 1px 0 rgba(255,255,255,.2) inset;
}

试图将所有这一切都转化为1 mixin正成为问题.在mixins中使用逻辑的文档非常稀疏.

我想创建一些mixin:

@mixin boxShadow($xOffSet, $yOffSet, $blur, $red, $green, $blue, $opacity, $inset : false) {
  @if $inset == true {
    -moz-box-shadow: #{$xOffSet}px #{$yOffSet}px #{$blur}px rgba($red,$green,$blue) inset;
  } @else {
    -moz-box-shadow: #{$xOffSet}px #{$yOffSet}px #{$blur}px rgba($red,$green,$blue);
  }
}

这是抛出错误,因为我猜Sass无法评估$ inset变量.

前面的例子只展示了我遇到的盒子阴影的问题.我遇到的另一个问题是,在单个元素上声明了多个框阴影.如果需要参考,请参阅上述#theLastDiv.

@mixin boxShadow($declarations : 2, $xOffSet1, $yOffSet1, $blur1, $red1, $green1, $blue1, $opacity1 …