其中像是:
width: calc(10px + 10px);
會被當成 string 編譯成:
width: calc(10px + 10px);
所以為了安插 Expression,就要寫成:
width: calc(#{ 10px + 10px });
而:
$some: 20px;
width: calc(100% - $some);
會變成
width: calc(100% - $some);
但:
-webkit-transition: all 10s + 1s cubic-bezier(.1 + .1, .10, .25, .90);
Function 裏頭的 Expression 還是會照常編譯,變成:
-webkit-transition: all 11s cubic-bezier(0.2, 0.1, 0.25, 0.9);
根據該文 linear-gradient 也是把 function params 當成 string,但是在新版 SASS 行為卻又不同了;
background: linear-gradient( 10deg + 45deg, blue, #000000 + #010101);
直接編譯成:
background: linear-gradient(55deg, blue, #010101);
啥?
再來看一些例子.. SASS Reference 內提到 expression 之間如果有空白或者逗號就是 List 表示,那麼我假設下面這樣是 List:
>> abc blacc abc
("abc" "blacc" "abc")
這樣是沒錯的,那再來試試看別的:
>> abc blacc a#{test} abc
"abc blacc atest abc"
居然變成 String 了,好吧文件上寫說可以用圓括號將 List 括起來,那這樣呢?
>> (abc blacc a#{test} abc)
"abc blacc atest abc"
居然還是 String .... WTF?
啥?
再來看一些例子.. SASS Reference 內提到 expression 之間如果有空白或者逗號就是 List 表示,那麼我假設下面這樣是 List:
>> abc blacc abc
("abc" "blacc" "abc")
這樣是沒錯的,那再來試試看別的:
>> abc blacc a#{test} abc
"abc blacc atest abc"
居然變成 String 了,好吧文件上寫說可以用圓括號將 List 括起來,那這樣呢?
>> (abc blacc a#{test} abc)
"abc blacc atest abc"
居然還是 String .... WTF?