扫码一下
查看教程更方便
Sass 列表(List)函数
Sass 列表(List)函数
Sass 列表(List)函数用于处理列表，可以访问列表中的值，向列表添加元素，合并列表等。
Sass 列表是不可变的，因此在处理列表时，返回的是一个新的列表，而不是在原有的列表上进行修改。
列表的起始索引值为 1，记住不是 0。
下表列出了 Sass 的列表函数：
| 函数 | 描述 & 实例 |
|---|---|
| append(list, value, [separator]) | 将单个值 value 添加到列表尾部。separator 是分隔符，默认会自动侦测，或者指定为逗号或空格。 实例: append((a b c), d) 结果: a b c d append((a b c), (d), comma) 结果: a, b, c, d |
| index(list, value) | 返回元素 value 在列表中的索引位置。 实例: index(a b c, b) 结果: 2 index(a b c, f) 结果: null |
| is-bracketed(list) | 判断列表中是否有中括号 实例: is-bracketed([a b c]) 结果: true is-bracketed(a b c) 结果: false |
| join(list1, list2, [separator, bracketed]) | 合并两列表，将列表 list2 添加到列表 list1 的末尾。separator 是分隔符，默认会自动侦测，或者指定为逗号或空格。 bracketed 默认会自动侦测是否有中括号，可以设置为 true 或 false。 实例: join(a b c, d e f) 结果: a b c d e f join((a b c), (d e f), comma) 结果: a, b, c, d, e, f join(a b c, d e f, $bracketed: true) 结果: [a b c d e f] |
| length(list) | 返回列表的长度 实例: length(a b c) 结果: 3 |
| list-separator(list) | 返回一列表的分隔符类型。可以是空格或逗号。 实例: list-separator(a b c) 结果: "space" list-separator(a, b, c) 结果: "comma" |
| nth(list, n) | 获取第 n 项的值。 实例: nth(a b c, 3) 结果: c |
| set-nth(list, n, value) | 设置列表第 n 项的值为 value。 实例: set-nth(a b c, 2, x) 结果: a x c |
| zip(lists) | 将多个列表按照以相同索引值为一组，重新组成一个新的多维度列表。 实例: zip(1px 2px 3px, solid dashed dotted, red green blue) 结果: 1px solid red, 2px dashed green, 3px dotted blue |
