/* 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;
}
單獨拿出其中之一
.myposition0101{
top: xxx;
left:xxx
}
*/