以后也别去别都地方找了，还是来这里找吧，比较方便
因为sass依赖于ruby环境，所以装sass之前安装ruby。
Add Ruby executables to your PATH，添加环境变量，不然以后使用编译软件的时候会提示找不到ruby环境，三个全部勾选
安装完以后，打开start command prompt with Ruby，cmd也可以
可以输入命令查看可安装哪些
gem list
然后直接在命令行中输入--安装sass
gem install sass安装成功后可以通过
sass -v 来查看sass都版本
sass -h 来查看帮助
sass style.scss style.css 单文件转换命令
sass --watch style.scss:style.css 单文件监听命令
sass --watch sassFileDirectory:cssFileDirectory 文件夹监听命令
如果安装不成功（一般都会不成功，至少我不同都网络环境不同都电脑都没成功），通过gem sources命令来配置源，先移除默认的https://rubygems.org源，然后添加淘宝的源https://ruby.taobao.org/，然后查看下当前使用的源是哪个，如果是淘宝的，则表示可以输入sass安装命令gem install sass了，关于常用gem source命令可参看：常用的gem source
$ gem sources --remove https://rubygems.org/
$ gem sources -a https://ruby.taobao.org/ 【如果你系统不支持https，请将淘宝源更换成：gem sources -a http://gems.ruby-china.org】$ gem sources -l*** CURRENT SOURCES ***https://ruby.taobao.org
# 请确保只有 ruby.taobao.org$ gem install sass就会成功了。
--------------------------------------------------分割-----------------------------------------------------
成功后，编译sass可以用start command prompt with Ruby也可以用编译工具，这里用Koala，
右边的auto compile（自动编译）把这个勾选上就可以了
output style有四种，分别是nested，expanded，compact，compressed，分别对应转换后css文件都排版格式
像我这种习惯写一长串都，还是选择 compact吧
sass都用法也写这这里吧，省得找了
首先
ass 和 SCSS 其实是同一种东西，我们平时都称之为 Sass，两者之间不同之处有以下两点：
文件扩展名不同，Sass 是以“.sass”后缀为扩展名，而 SCSS 是以“.scss”后缀为扩展名语法书写方式不同，Sass 是以严格的缩进式语法规则来书写，不带大括号({})和分号(;)，而 SCSS 的语法书写和我们的 CSS 语法书写方式非常类似。so...如果保存成sass后缀，而又不严格遵守他都语法规则，是会报错的
1、sass允许定义变量
$fontStack: Helvetica, sans-serif;$primaryColor: #333;body { font-family: $fontStack; color: $primaryColor;} 2、sass可以进行选择器的嵌套，表示层级关系
nav { ul { margin: 0; padding: 0; list-style: none; }} 3、sass中如导入其他sass文件，最后编译为一个css文件，优于纯css的@import
4、sass中可用mixin定义一些代码片段，且可传参数，方便日后根据需求调用。从此处理css3的前缀兼容轻松便捷。
@mixin box-sizing ($sizing) { -webkit-box-sizing:$sizing; -moz-box-sizing:$sizing; box-sizing:$sizing;}.box-border{ border:1px solid #ccc; @include box-sizing(border-box);} 5、sass可通过@extend来实现代码组合声明
.message { border: 1px solid #ccc; padding: 10px; color: #333;}.success { @extend .message; border-color: green;}编译后.message, .success { border: 1px solid #cccccc; padding: 10px; color: #333;}.success { border-color: green;} 6、运算
.container { width: 100%; }article{ float: left; width: 600px / 960px * 100%; //width:62.5%; 7、颜色
$linkColor: #08c;a { text-decoration:none; color:$linkColor; &:hover{ color:darken($linkColor,10%); //变暗10% color: #006699; }} 参考资料 http://www.w3cplus.com/blog/tags/302.html