据说，sass评分： 5，less 3分。简单说，sass 功能更强大，生成的 css 更优雅。

安装

less 是 javascript(nodejs)。sass 是 ruby。安装 sass，终端执行

sudo gem install sass

sass -v 查看版本，成功

sublime 自动编译

+shift+p 打开 包管理器，搜索安装 sass build

安装 SublimeOnSaveBuild，打开 包设置的 user，加入 sass|scss

{
    "filename_filter": "\\.(jade|less|coffee|scss|sass)$",
    "build_on_save": 1
}

以后，保存 .scss(sass)的同时编译 .css 文件。

小贴士：scss 和 sass 是一回事。区别在于语法不同：scss 用大括号分割；sass 用缩进分割。

scss 例子

• 测试1


• 测试1


• 测试1

scss 内容

.sass-vs-less-example {
    a {
        display: block;
        text-decoration: none;
        span {
            display: block;
            height: 2px;
            background:-webkit-linear-gradient(left, #c00,#c00 5%,rgba(0,0,0,0.25) 5%,rgba(0,0,0,0));
            background:-moz-linear-gradient(left, #c00,#c00 5%,rgba(0,0,0,0.25) 5%,rgba(0,0,0,0));
            background-size: 200% 100%;
            background-position: 100% 0;
            transition:all .5s ease-in-out;
        }
        &:hover span {
            background-position:-100% 0;
        }
    }
}

渲染后的 css（一开始看，还蛮古怪的）

.sass-vs-less-example a {
  display: block;
  text-decoration: none; }
  .sass-vs-less-example a span {
    display: block;
    height: 2px;
    background: -webkit-linear-gradient(left, #cc0000, #cc0000 5%, rgba(0, 0, 0, 0.25) 5%, rgba(0, 0, 0, 0));
    background: -moz-linear-gradient(left, #cc0000, #cc0000 5%, rgba(0, 0, 0, 0.25) 5%, rgba(0, 0, 0, 0));
    background-size: 200% 100%;
    background-position: 100% 0;
    transition: all .5s ease-in-out; }
  .sass-vs-less-example a:hover span {
    background-position: -100% 0; }

区别

• less 没有专门的循环（都是用 when 判断）；sass 有 if then else 还有for, while 和 each
• compass是 sass 的 framework 使用更方便。
• sass @extend

输出参数

sass 123.scss --style nested

• nested 默认

#main {
  color: #fff;
  background-color: #000; }

• expanded

#main {
  color: #fff;
  background-color: #000;
}    

- compact

#main { color: #fff; background-color: #000; }

• compressed

#main{color:#fff;background-color:#000}#main p{width:10em}...

via http://css-tricks.com/sass-vs-less/