预处理工具

预处理工具

不同的 CSS 预处理工具有着不同的特性、功能以及语法。编码习惯应当根据使用的预处理工具进行扩展，
以适应其特有的功能。推荐在使用 SCSS 时遵守以下指导。

• 将嵌套深度限制在1级。对于超过2级的嵌套，给予重新评估。这可以避免出现过于详实的 CSS 选择器。
• 避免大量的嵌套规则。当可读性受到影响时，将之打断。推荐避免出现多于20行的嵌套规则出现。
• 始终将@extend语句放在声明块的第一行。
• 如果可以的话，将@include语句放在声明块的顶部，紧接着@extend语句的位置。
• 考虑在自定义函数的名字前加上x-或其它形式的前缀。这有助于避免将自己的函数和 CSS 的原生函数混淆，
  或函数命名与库函数冲突。

.selector {
  @extend .other-rule;
  @include clearfix();
  @include box-sizing(border-box);
  width: x-grid-unit(1);
  // 其他声明
}