Jerry之前的文章【.scss文件中的特殊符号-%百分号和$美元符号】()介绍了scss文件中的两个特殊符号，%和百分号的用法美元符号$。本文介绍另一个特殊符号@的用法。使用预处理器的优势之一是它们能够处理复杂、冗长的代码并将其简化。这就是mixin派上用场的地方！@mixinborder-radius($radius){-webkit-border-radius:$radius;-moz-边界半径：$radius；-ms-边界半径：$radius；border-radius:$radius;}.box{@includeborder-radius(10px);}和占位符%一样，@mixin本身定义的border-radius不会出现在最终的css文件中。这是一种非侵入式的定义方式。box类使用@include将border-radius的内容全部包含进去，有点像编程语言中的宏替换，也支持参数替换。最终生成的css内容：.box{-webkit-border-radius:10px;-moz-边框半径：10px；-ms-边框半径：10px；border-radius:10px;}Spartacus中的一个例子：%cx-product-facet-navigation{min-width:0;//在桌面体验中隐藏过滤器按钮@includemedia-breakpoint-up(lg){button.dialog-trigger{display:none;}}}这里media-breakpoint-up是mixin的名字，lg是传入参数。我们在SAPSpartacus的源代码中看不到media-breakpoint-up的定义。这些media-breakpoint-ups来自bootstrap，这也是SAPSpartacus的依赖之一：
