所謂值列表 (lists) 是指 Sass 如何處理 CSS 中:
margin: 10px 15px 0 0
或者:
font-face: Helvetica, Arial, sans-serif
像上面這樣通過空格或者逗號分隔的一系列的值。
事實上,獨立的值也被視為值列表——只包含一個值的值列表。
Sass列表函數(shù)(Sass list functions)賦予了值列表更多功能(Sass進級會有講解):
nth函數(shù)(nth function) 可以直接訪問值列表中的某一項;
join函數(shù)(join function) 可以將多個值列表連結(jié)在一起;
append函數(shù)(append function) 可以在值列表中添加值;
@each規(guī)則(@each rule) 則能夠給值列表中的每個項目添加樣式。
值列表中可以再包含值列表,比如 1px 2px, 5px 6px 是包含 1px 2px 與 5px 6px 兩個值列表的值列表。如果內(nèi)外兩層值列表使用相同的分隔方式,要用圓括號包裹內(nèi)層,所以也可以寫成 (1px 2px) (5px 6px)。當(dāng)值列表被編譯為 CSS 時,Sass 不會添加任何圓括號,因為 CSS 不允許這樣做。(1px 2px) (5px 6px)與 1px 2px 5px 6px 在編譯后的 CSS 文件中是一樣的,但是它們在 Sass 文件中卻有不同的意義,前者是包含兩個值列表的值列表,而后者是包含四個值的值列表。
可以用 () 表示空的列表,這樣不可以直接編譯成 CSS,比如編譯 font-family: ()時,Sass 將會報錯。如果值列表中包含空的值列表或空值,編譯時將清除空值,比如 1px 2px () 3px 或 1px 2px null 3px。