sass - for循環寫法

如要設置多個li的動畫延遲時間時

注：這里選擇器要加#{}才行

不然就會編譯成：

 

---

 

6.7. 插值語句 #{} (Interpolation: #{})

通過 #{} 插值語句可以在選擇器或屬性名中使用變量：

$name: foo;
$attr: border;
p.#{$name} {
  #{$attr}-color: blue;
}

編譯為

p.foo {
  border-color: blue; }

#{} 插值語句也可以在屬性值中插入 SassScript，大多數情況下，這樣可能還不如使用變量方便，但是使用 #{} 可以避免 Sass 運行運算表達式，直接編譯 CSS。

p {
  $font-size: 12px;
  $line-height: 30px;
  font: #{$font-size}/#{$line-height};
}

編譯為

p {
  font: 12px/30px; }

想繼續深究sass語法，請看sass中文網 的 

• 6. SassScript