/* sass 可以用写JS的思想来写CSS代码
* #{} 用来插值，大括号中填写需要插入的变量 * @for 变量 from 1 through 9 从1到9循环 * $sizei 定义一个变量 值为 $i * 7.5 * .myposition0#{$i}0#{$j} class类名中插入变量值//作用举例：定位大量规律增减的 top left值 @for $i from 1 through 9 { $sizei : $i * 7.5; @for $j from 1 through 9 { $sizej : $j * 7.5; .myposition0#{$i}0#{$j}{ top : #{$sizei}vw; left : #{$sizej}vw; } } @for $n from 10 through 11 { $sizen : $n * 7.5; .myposition0#{$i}#{$n}{ top : #{$sizei}vw; left : #{$sizen}vw; } } }; @for $i from 10 through 11 { $sizei : $i * 7.5; @for $j from 1 through 9 { $sizej : $j * 7.5; .myposition#{$i}0#{$j}{ top : #{$sizei}vw; left : #{$sizej}vw; } } @for $n from 10 through 11 { $sizen : $n * 7.5; .myposition#{$i}#{$n}{ top : #{$sizei}vw; left : #{$sizen}vw; } } }
以上代码，编译之后变成如下代码
.myposition0101, .myposition0102, .myposition0103, .myposition0104, .myposition0105, .myposition0106, .myposition0107, .myposition0108, .myposition0109, .myposition0110, .myposition0111 { top: 7.5vw; } .myposition0201, .myposition0202, .myposition0203, .myposition0204, .myposition0205, .myposition0206, .myposition0207, .myposition0208, .myposition0209, .myposition0210, .myposition0211 { top: 15vw; } .myposition0301, .myposition0302, .myposition0303, .myposition0304, .myposition0305, .myposition0306, .myposition0307, .myposition0308, .myposition0309, .myposition0310, .myposition0311 { top: 22.5vw; }......
.myposition0111, .myposition0211, .myposition0311, .myposition0411, .myposition0511, .myposition0611, .myposition0711, .myposition0811, .myposition0911, .myposition1011, .myposition1111 { left: 82.5vw; }