SASS |列出函数

SASS 列表函数用于修改新列表。需要在圆括号内创建列表以与其他列表区分开来。 SASS 列表无法更改，因此在某些情况下会创建新列表。
就像字符串函数一样，SASS 列表是基于一个(不是从零)索引的，这意味着字符串的第一个元素出现在索引 1(而不是索引 0)处。

以下列表代表了 SASS 中的所有列表函数：

1. list-separator($list)函数：该函数以字符串返回列表中使用的分隔符的名称。

• 示例 1：

CSS

list-separator((1, 2, 3))

• 输出：

"comma"

• 示例 2：

CSS

list-separator((1 2 3))

• 输出：

"space"

2. zip($lists)函数：该函数将给定列表的值划分为单个多维列表。

• 例子：

CSS

zip(1px 2px 3px, solid dashed dotted, red green blue)

• 输出：

1px solid red, 2px dashed green, 3px dotted blue

3. join($list1, $list2, [$separator])函数：该函数将 $list2 附加到 $list1 的末尾。分隔符参数可以包含值“逗号、空格或自动”。 auto 值也是默认值，将使用第一个列表中的分隔符。

• 示例 1：

CSS

join(1 2 3, 4 5 6)

• 输出：

(1 2 3 4 5 6)

• 示例 2：

CSS

join((1, 2, 3), (4 5 6), comma)

• 输出：

(1, 2, 3, 4, 5, 6)

• 示例 3：

CSS

join((1, 2, 3), (4 5 6), space)

• 输出：

(1 2 3 4 5 6)

4. nth($list, $n)函数：该函数返回列表的^第n^个元素。

• 例子：

CSS

nth(5 4 6 7 8 9 1, 4)

• 输出：

7

5. set-nth($list, $n, $value)函数：该函数将列表的^第n^个元素设置为提供的值。

• 例子：

CSS

set-nth(5 4 6 7 8 9 1, 3, 5)

• 输出：

(5 4 5 7 8 9 1)

6. index($list, $value)函数：该函数返回值调用的特定索引位置处的元素。

• 例子：

CSS

index((5 6 4 2 3 9 7), 4)

• 输出：

2

7. length($list)函数：该函数返回列表中元素的数量。

• 例子：

CSS

length(5 4 6 7 8 9 1)

• 输出：

7

8. is-bracketed($list)函数：这个函数检查列表是否有任何方括号。

• 示例 1：

CSS

is-bracketed([a b c])

• 输出：

true

• 示例 2：

CSS

is-bracketed(a b c)

• 输出：

false

9. append($list1, $val, [$separator])函数：该函数将提供的单个值附加到列表的末尾。如果提供了分隔符参数(“auto”是默认分隔符)，则完整列表将遵循分隔符函数。

• 示例 1：

CSS

append((1, 2, 3), 4, comma)

• 输出：

(1, 2, 3, 4)

• 示例 2：

CSS

append((1, 2, 3), 4, space)

• 输出：

(1 2 3 4)