SCSS Nubmer 型別

antzone發表於2017-05-09

SCSS中的Number型別與其他程式語言是類似的,但是不同點也很突出。

如下資料在SCSS都是Number型別:

[Scss] 純文字檢視 複製程式碼
1, 2, 13, 10px。

但是在其他程式語言中,10px基本不可能是Number型別;

在SCSS中,很多時候數字結合CSS單位依然是一個Number型別。

看如下程式碼例項:

[Scss] 純文字檢視 複製程式碼
$size: 5;
$px-unit: $size * 1px;
$px-string: $size + px;
$px-number: $px-unit / 1px;

宣告一個變數,並賦值為5,自然它是一個Number型別。

(1).$px-number:Number型別,1px可以認為是一個數字,是一個數字之間的乘法運算。

(2).$px-string:String型別,px單獨出現會被看做一個字串,使用+號,那麼就是字串連線操作。

(3).$px-number:Number型別,SCSS中允許帶有相同單位的除法操作,結果是5。