学习笔记：SASS

SASS：

http://www.sass.hk/sass-course.html 　　SASS　　2015-10-10

http://sass.bootcss.com/docs/sass-reference/ 　　Sass参考手册　　2015-10-11

http://www.ruanyifeng.com/blog/2012/06/sass.html 　　阮一峰的SASS用法指南

sass文件后缀：1.scss

@charset "UTF-8";//这一句一定要写，否则utf8编码的文件，如果包含中文的，编译会出错
@mixin radius5 {//圆角
  -moz-border-radius: 5px;
  -webkit-border-radius: 5px;
  border-radius: 5px;
}
.note1 {
  background-color: green;
  @include radius5;
}

cmd输入命令：sass 1.scss 1.css，编译结果如下：

.note1 {
  background-color: green;
  -moz-border-radius: 5px;
  -webkit-border-radius: 5px;
  border-radius: 5px; }

/*# sourceMappingURL=1.css.map */

 

Sass的安装：

http://rubyinstaller.org/downloads 　　官网下载　　http://dl.bintray.com/oneclick/rubyinstaller/rubyinstaller-2.2.3-x64.exe　　64位的

https://ruby.taobao.org/　　

安装过程中请注意勾选Add Ruby executables to your PATH

ruby -v
gem sources --remove https://rubygems.org/    //1.删除原gem源
gem sources -a https://ruby.taobao.org/        //2.添加国内淘宝源
gem sources -l                    //3.打印是否替换成功

//安装如下(如mac安装遇到权限问题需加 sudo gem install sass)
gem install sass
gem install compass

sass -v
compass -v

gem update sass    //更新sass
sass -v        //查看sass版本
sass -h        //查看sass帮助

 

 

 

 

 

....