當需要聚合偽類?`:nth-*`?的時候,使用?`@for`?循環很有用。除了這些使用場景,如果_必須_迭代最好還是使用?`@each`?循環。
~~~
@for $i from 1 through 10 {
.foo:nth-of-type(#{$i}) {
border-color: hsl($i * 36, 50%, 50%);
}
}
~~~
要堅持一貫的傳統,始終使用?`$i`?作為變量名,除非有非常好的原因,否則永遠不要使用?`to`?關鍵字:而是始終使用?`through`。許多開發者甚至不知道 Sass 有這個變化;使用它可能會造成混亂。
最后,確保遵循規范以保持可讀性:
* `each`?前添加空行;
* 除非下一行是右閉大括號(`}`),否則在所有右閉大括號(`}`)后面添加新行。
- 關于作者
- 貢獻
- 關于Sass
- Ruby Sass Or LibSass
- Sass Or SCSS
- 其他預編譯器
- 簡介
- 為什么需要一個樣式指南
- 免責聲明
- 核心原則
- 語法格式
- 字符串
- 數字
- 顏色
- 列表
- Maps
- CSS規則集
- 聲明順序
- 選擇器嵌套
- 命名約定
- 常量
- 命名空間
- 注釋
- 標示注釋
- 文檔
- 結構
- 組件
- 7-1模式
- Shame文件
- 響應式設計和斷點
- 命名斷點
- 斷點管理器
- 媒體查詢用法
- 變量
- 作用域
- !default標識符
- !global標識符
- 多變量或maps
- 擴展
- 混合宏
- 基礎
- 參數列表
- 混合宏和瀏覽器前綴
- 條件語句
- 循環
- Each
- For
- While
- 警告和錯誤
- 警告
- 錯誤
- 工具
- Compass
- 柵格系統
- SCSS-Lint
- 總結概要