列表函数
列表功能用于访问列表中的值,合并列表以及向列表中添加项目。
Sass 列表是不可变的(它们不能更改);因此,返回列表的列表函数将返回新列表,而不更改原始列表。
Sass 列表基于1。 列表中的第一个列表项位于索引1,而不是0。
下表列出了 Sass 中的所有列表功能:
函数 |
描述 & 示例 |
append(list, value, [separator]) |
将一个值添加到列表的末尾;分隔符可以是自动,逗号或空格;默认为自动。
示例:
append((a b c), d)
返回结果: a b c d
append((a b c), (d), comma)
返回结果: a, b, c, d
|
index(list, 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的末尾;分隔符可以是自动,逗号或空格;auto是默认值(将使用第一个列表中的分隔符);方括号可以是auto,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个列表元素设置为指定的值。
示例:
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
|