控制指令

Sass提供了一些基础的控制指令，比如在满足一定条件时引用样式，或者设定范围重复输出格式。控制指令是一种高级功能，日常编写过程中并不常用到

@if

当 @if 的表达式返回值不是 false 或者 null 时，条件成立，输出 {} 内的代码

xxxxxxxxxx
p {
    @if 1+1==2 {
        border: 1px solid;
    }
    @if 5 < 3 {
        border: 2px dotted;
    }
    @if null {
        border: 3px double;
    }
}

@for

@for 指令可以在限制的范围内重复输出格式，每次按要求（变量的值）对输出结果做出变动。

xxxxxxxxxx
@for $i from 1 through 3 {
    .item-#{$i} {
        width: 2px * $i;
    }
}