Less 和 Sass 都属于 CSS 预处理器的范畴，也就是 CSS 的超集，但是两者的语法、如何使用和具体的功能实现还是有差异的

1、声明和使用变量

• Less 采用 @ 符号，Sass 采用 $ 符号。

Less 方式
@link-color: #428bca;
#main {
  @width: 5em;
  width: @width;
  color: @link-color;
}

Sass 方式
$link-color: #428bca;
#main {S
  $width: 5em;
  width: $width;
  color: $link-color;
}

2、变量插值(变量选择器)

• Less 采用 @{xxxx} 的形式，Sass 采用 ${xxxx} 的形式。

Less 方式
@my-style: submit-btn
.@{my-style}{
  color: '#000'
}

Sass 方式
$my-style: submit-btn
.${my-style}{
  color: '#000'
}

3、Mixins 的定义、使用及参数

• 定义函数 , Less直接调用。Sass通过@mixin关键字声明，@include调用

 Less 方式
//center-block为函数
.center-block(@color,@fintSize: 18) {
  display: block;
  margin: 10px;
  color: @color;
  font-size: @fintSize;
}
.main {
    .center-block('#000');
}

Sass 方式
@mixin center-block(@color,@fintSize: 18) {
  display: block;
  margin: 10px;
  color: @color;
  font-size: @fintSize;
}
.main {
    @include center-block('#000');
}