Question

sass @mixin 这样使用为什么出不来效果？？求大神帮忙

@mixin rounded($property,$val){
#{$property}:$val;
-moz-#{$property}:$val;
-webkit-#{$property}:$val;
-o-#{$property}:$val;
-ms-#{$property}:$val;
}
这样定义
@include rounded(border-radius,30px);

这是调用
-moz-30px: 30px;
-webkit-30px: 30px;
-o-30px: 30px;
-ms-30px: 30px;
这是编译后出现的结果~~为什么会是这样的啊？

Answer 1

初学者也不是很懂，不过你想要的还是出来了：

@mixin rounded($property,$val){
#{$property}:$val;
-moz-#{$property}:$val;
-webkit-#{$property}:$val;
-o-#{$property}:$val;
-ms-#{$property}:$val;
}
/*需要另外的样式来引用它*/
.A{
  @include rounded(border-radius,30px);
}

/*结果*/
.A {
  border-radius: 30px;
  -moz-border-radius: 30px;
  -webkit-border-radius: 30px;
  -o-border-radius: 30px;
  -ms-border-radius: 30px; 
 }

Answer 2

最好不要把属性改为$变量