scss 條件語句 迴圈語句使用

2021-09-29 14:44:30 字數 1342 閱讀 2087

$type

: monster;

p@else if $type == matador

@else if $type == monster

@else }

/*編譯為*/

p

兩種格式:

@for $var from through包含 與 的值

@for $var from to只包含

$var 可以是任何變數,比如 $i; 和 必須是整數值

@for $i from 1 through 3

}/*編譯為*/

.item-1

.item-2

.item-3

格式:

$var in

遍歷列表

@each $animal in puma, sea-slug, egret, salamander

-icon

.png');}

}/*編譯為*/

.puma-icon

.sea-slug-icon

.egret-icon

.salamander-icon

@each $animal, $color, $cursor in (puma, black, default),

(sea-slug, blue, pointer),

(egret, white, move)

-icon

.png')

;border

: 2px solid $color;

cursor

: $cursor;

}}

.puma-icon

.sea-slug-icon

.egret-icon

物件遍歷

@each $header, $size in (

h1: 2em, h2

: 1.5em, h3

: 1.2em) }

/*編譯成*/

h1h2

h3

$i

: 6;

@while $i > 0

$i: $i - 2;

}/*編譯後*/

.item-6

.item-4

.item-2

條件語句 迴圈語句

1 switch case switch中的比較是用的equals,而不是 switch中只能使用byte short int char string 列舉型別。不能使用long flaot double 各個case標籤不必連續 也不按特定順序排列,default標籤可位於switch case結...

條件語句和迴圈語句

條件語句 if語句有三種用法 1.if 表示式 如果表示式的值為真,則執行括號內的復合語句 2.if 表示式 else 如果表示式的值為真,則執行語句1,否則執行語句2 3.if 表示式 else if else if else 如果表示式的值為真,則執行對應的語句然後跳出if語句執行後面的語句,若...

條件語句與迴圈語句

1 while迴圈,條件為真的時候重複執行乙個 塊,當需要為乙個集合的每乙個元素執行乙個 塊的時候就需要for迴圈了。能使用for迴圈,就盡量不使用while迴圈。while 條件 else語句 迴圈體else 條件不成立時執行的內容 for變數in 可迭代物件 迴圈體else 條件不成立時執行的內...