何时使用混合宏如果你整个网站有几个小样式是相似的，比如颜色，字体等，你可以在Sass中使用变量统一处理，那么这个是个不错的选择。但是当你的样式越来越复杂，需要复用大段样式时，使用变量就达不到我们的目的了。这就是Sass中的mixin宏很有意义的地方。声明一个不带参数的混入：在Sass中，使用“@mixin”来声明一个混入。例如：@mixinborder-radius{-webkit-border-radius:5px;border-radius:5px;}其中@mixin是用于声明混合宏的关键字，类似于CSS中的@media和@font-face。border-radius是mixin宏的名称。大括号内是重用的样式代码。带参数混合宏：除了声明不带参数的混合宏外，还可以定义带参数的混合宏，如：@mixinborder-radius($radius:5px){-webkit-border-radius:$radius;border-radius:$radius;}复杂的mix-in宏：上面是简单的mix-in宏的定义方式，当然Sass中的mix-in宏也提供了更复杂的，你可以写在花括号里，有逻辑关系，有助于更好地做你想做的事情，例如：@mixinbox-shadow($shadow...){@iflength($shadow)>=1{@includeprefixer(box-shadow,$shadow);}@else{$shadow:004pxrgba(0,0,0,.3);@includeprefixer(box-shadow,$shadow);}}这个box-shadow混合宏有多个参数，此时可以用“...”代替。简单解释一下，当$shadow的参数值大于等于“1”时，表示有多个阴影值，否则默认参数值“004pxrgba(0,0,0,.3)”被调用。调用混合宏在Sass中，混合宏是通过@mixin关键字声明的，所以在实际调用中，匹配一个关键字“@include”来调用声明的混合宏。例如，您在样式中定义了一个圆角混合宏“border-radius”：@mixinborder-radius{-webkit-border-radius:3px;border-radius:3px;}在按钮中调用定义混合宏“border-radius”可以这样使用：button{@includeborder-radius;}此时编译的CSS：button{-webkit-border-半径：3px；边界半径：3px；}
