Sass初使用

看慕课网materliu前辈的sass教程，http://www.imooc.com/learn/364。顺便把刚做完的项目重构一下，然后把一些笔记和心得都写在这里~

　　首先安装sass，这里直接参考 大漠前辈的安装教程 http://www.w3cplus.com/sassguide/install.html。

　　然后安装compass， 在ruby command 里面打命令，gem install compass 就好了；就现阶段来说，对compass理解的不是很多，看完sass那个视频之后就觉得暂时只是用来编译scss文件和压缩css（雾）。

　　compass指令：

　　compass create compass；

　　compass watch;

　　sass语法：

　　当文件不用编译的时候，可以用_前缀下划线来标记然后命名，通常函数或者变量都放在一个文件夹里面。

　　文件引进来可以用import ，文件名后缀可以不用写， 然而这个不是css原生的import。

　　css原生的import两大弊端：1、一定要放在代码最前面。2、对性能不利。如果真的要使用原生的import，那么就要：1、以css结尾的时候。2、http：//开头。3、URL（）函数。4、带有media queries。

　　sass变量：好东西，譬如每次找颜色的时候，颜色代码都记不住，如果用变量的话就不用这么慢慢找颜色代码了，直接看一下变量文件，一目了然咯。

　　　　特殊变量，在特定情况下使用的变量；

　　　　eg：

　　　　

 //普通变量及其使用
$common-ff :"微软雅黑"; //字体设置
body { 
    font-family :  $common-ff ;
} 
//css 

输出---- body { font-family : "微软雅黑" ; } //特殊变量 $direction: top; //应用于class和属性 .border-# { $direction }{ border-#{$direction } :1px solid #ccc; } //应用于特殊属性同理

查看更多关于Sass初使用的详细内容...