Sass mixin参数 _参数

本文概述

关键字参数
可变参数

mixin参数是SassScript值, 当包含mixin时将传递这些值并将其用作变量。
参数是定义混入时用逗号分隔的变量的名称。 Sass中有两种类型的mixin参数。

关键字参数
可变参数

关键字参数关键字参数用于包含在mixins中。它指定可以以任何顺序传递命名的参数, 并且可以省略参数的默认值。
SCSS语法：

@mixin bordered($color, $width: 2px) {color: #77C1EF; border: $width solid black; width: 500px; }.style{@include bordered($color:#77C1EF, $width: 5px); }

编译之后, 你将获得以下CSS代码。
CSS：

.style {color: #77C1EF; border: 5px solid black; width: 500px; }

可变参数可变参数用于将任意数量的参数传递给mixin。当你要处理未知数量的参数时, 将使用它。它包含传递给函数或mixin的关键字参数。可以使用keyword($ args)函数访问传递的关键字参数, 该函数返回映射到String的值。
SCSS语法：

@mixin linear-gradient($direction, $gradients...) {background-color: nth($gradients, 1); background-image: linear-gradient($direction, $gradients...); }.selector {@include linear-gradient(to right, magenta, red, orange, yellow, green, blue, purple); }

【Sass mixin参数】编译之后, 你将获得以下CSS代码。
CSS：