SCSS自定义函数
在 SCSS 中, @function 允许你自定义函数,用来封装一段计算逻辑并返回一个具体的值(如颜色、数字、字符串等)。这可以让你将常用的计算过程抽象出来,使样式代码更简洁、更可维护。
1. 基本语法
scss
@function 函数名($参数1, $参数2, ...) {
// 一些计算或处理
@return 返回值;
}
- 函数名:可以包含连字符和下划线,SCSS 中两者等价(如
column-width和column_width视为同一函数)。 - 参数:可设置默认值,如
$param: 10px。 @return:必须且只能返回一个值,函数体内可包含控制指令(@if、@for等)和变量。