变量部分

  1. $myColor: #fff;
  2. $myString: 'sss';
  1. @myColor: #fff;
  2. @myString: 'sss';

mixin 部分

  1. // define
  2. @mixin alert-variant($background, $border, $text-color) {
  3.   background-color: $background;
  4.   border-color: $border;
  5.   color: $text-color;
  7.   hr {
  8.     border-top-color: darken($border, 5%);
  9.   }
  10.   .alert-link {
  11.     color: darken($text-color, 10%);
  12.   }
  13. }
  15. // use
  16. .test {
  17.   @include alert-variant($bg, $b, $t)
  18. }
  1. .alert-variant(@background; @border; @text-color) {
  2.   background-color: @background;
  3.   border-color: @border;
  4.   color: @text-color;
  6.   hr {
  7.     border-top-color: darken(@border, 5%);
  8.   }
  9.   .alert-link {
  10.     color: darken(@text-color, 10%);
  11.   }
  12. }

With Gulp

这里顺便一说，gulp-sass 会过滤掉以 underscore 下划线 _ 开头的文件