sass高階 變數運算

2022-06-14 12:33:07 字數 641 閱讀 3226

/*變數操作 (兩個變數之間的運算子需要用空格隔開,否則會報錯。)

==,!=

<,>,<=,>=

+,-,*,/,%

*/$width1:50px;

$width2:100px;

body

/*連字符號中間使用帶空格的加號效果不變*/

a:hover

注意:說明運算時sass只關注運算子前後兩個用空格隔開的值,其餘的都不管原樣輸出

層級關係:雙引號權重最大,沒有引號其次,單引號的權重最低,有雙引號則結果有雙引號,單雙都有結果為雙,只有單引號則結果沒有引號

a:before

a:before

a:before

字串引用變數時不能使用變數名直接引用,需要加上#好號和大括號才能引用成功,否則將原樣輸出

$version:1.6;

p:before';

}$height1:10px;

$height2:20px;

span

注:運算規則:

1、運算子前後需要使用空格隔開;

2、兩個變數若是單位不一致則無法進行計算。

3、乙個帶單位乙個不帶單位則以帶單位的單位為結果單位。

4、除法計算時必須要求被除數帶單位,除數不帶單位

Sass字元運算

在 sass 中可以通過加法符號 來對字串進行連線。例如 content hello sass box before 編譯出來的css box before 除了在變數中做字元連線運算之外,還可以直接通過 把字元連線在一起 div 編譯出來的css div 注意,如果有引號的字串被新增了乙個沒有引號...

sass的高階語法

1.變數 sass允許使用變數,所有變數以 開頭 2.引用父元素 這裡 就代表是 a 3.繼承 這樣 class2 就 擁有了class1的所有屬性 4.可以重複使用的 塊 5.混入,呼叫可以重用的 塊 如果你用 mixin定義了 那麼呼叫需要使用 include 引用 6.計算 就是簡單的加減乘除...

Sass 變數預設 default

如果分配給變數的值後面新增了 default 標誌 這意味著該變數如果已經賦值,那麼它不會被重新賦值,但是,如果它尚未賦值,那麼它會被賦予新的給定值。如果在此之前變數已經賦值,那就不使用預設值,如果沒有賦值,則使用預設值。如果變數之前沒有賦值,則使用預設值 如果之前沒有賦值,則使用預設值 const...