ThinkChat2.0新版上线,更智能更精彩,支持会话、画图、阅读、搜索等,送10W Token,即刻开启你的AI之旅 广告
## 5.1 条件语句 @if可以用来判断: >   p { >     @if 1 + 1 == 2 { border: 1px solid; } >     @if 5 < 3 { border: 2px dotted; } >   } 配套的还有@else命令: >   @if lightness($color) > 30% { >     background-color: #000; >   } @else { >     background-color: #fff; >   } ## 5.2 循环语句 SASS支持for循环: >   @for $i from 1 to 10 { >     .border-#{$i} { >       border: #{$i}px solid blue; >     } >   } 也支持while循环: >   $i: 6; > >   @while $i > 0 { >     .item-#{$i} { width: 2em * $i; } >     $i: $i - 2; >   } each命令,作用与for类似: >   @each $member in a, b, c, d { >     .#{$member} { >       background-image: url("/image/#{$member}.jpg"); >     } >   } ## 5.3 自定义函数 SASS允许用户编写自己的函数。 >   @function double($n) { >     @return $n * 2; >   } > >   #sidebar { >     width: double(5px); >   } (完)