sass混合指令(Mixin Directives)

混合指令(Mixin)用于定义可重复使用的样式。混合指令可以包含所有的 CSS 规则,绝大部分 Sass 规则,甚至通过参数功能引入变量,输出多样化的样式。

定义与使用混合样式

例如:
在这里插入图片描述

在这里插入图片描述

参数

参数用于给混合指令中的样式设定变量,并且赋值使用。在定义混合指令的时候,按照变量的格式,通过逗号分隔,将参数写进圆括号里。引用指令时,按照参数的顺序,再将所赋的值对应写进括号。

直接指定参数的值,使用时的顺序和定义时的顺序要对应上

例如:
在这里插入图片描述

关键词参数

如果指定参数的名称和参数的值,使用时的顺序和定义时的顺序不需要对应,例如
在这里插入图片描述

或者:
在这里插入图片描述

定义时指定参数的默认值

例如:
在这里插入图片描述

参数变量 (Variable Arguments)

参数变量就是可变参数。有时,不能确定混合指令需要使用多少个参数,这时,可以使用参数变量 … 声明(写在参数的最后方)告诉 Sass 将这些参数视为值列表处理。

例如:
在这里插入图片描述

自动编译后的css文件为:
在这里插入图片描述

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值