混合指令(Mixin)用于定义可重复使用的样式。混合指令可以包含所有的 CSS 规则,绝大部分 Sass 规则,甚至通过参数功能引入变量,输出多样化的样式。
定义与使用混合样式
例如:
参数
参数用于给混合指令中的样式设定变量,并且赋值使用。在定义混合指令的时候,按照变量的格式,通过逗号分隔,将参数写进圆括号里。引用指令时,按照参数的顺序,再将所赋的值对应写进括号。
直接指定参数的值,使用时的顺序和定义时的顺序要对应上
例如:
关键词参数
如果指定参数的名称和参数的值,使用时的顺序和定义时的顺序不需要对应,例如
或者:
定义时指定参数的默认值
例如:
参数变量 (Variable Arguments)
参数变量就是可变参数。有时,不能确定混合指令需要使用多少个参数,这时,可以使用参数变量 … 声明(写在参数的最后方)告诉 Sass 将这些参数视为值列表处理。
例如:
自动编译后的css文件为: