什么是scss？可以用一句话来定义：scss是css的智能版。
简单来说，scss是可以定义变量、嵌套父子集、mixin、扩展/继承、比例运算、自动生成颜色的智能版css，scss将让css不再是单纯又单调的配置文件，他赋予了它生命与活力。
简单介绍一下，当然，要坚持看完需要你有一定的快速理解能力与代码熟悉程度。
1、定义变量：比如定义$TitleColor:#333，而后可以这样写：color:$TitleColor;编码之后会转变成color:#333;
？？？什么鬼？？？这不是把简单的问题复杂化了吗？可以直接使用的颜色为什么要增加一步操作？
看起来似乎是这个道理，似乎简单的几个数字反而变麻烦了？只是，页面写完了并不代表一劳永逸了，不管什么时候不要忘记还有后期的更新维护。
如果使用了变量，那么改动变量就相当于改动所有用到此属性的代码，这才是优化利器。
？？？什么鬼？？？我可以批量替换啊？？？
如果相同颜色、相同属性只用在一个地方如大标题，批量替换倒也可行，只是如果大标题、导航栏你都用的这种属性，或者更多地方用到了这属性，可以批量替换吗？
定义变量这功能，就相当于ps里的智能对象，异曲同工之妙，不外如是。
2、嵌套：所谓嵌套，意思是nav里的ul、nav里的li以及nav里的a，都可以写在nav属性的大括号之中，用了scss后，就不需要那么多的空格、不用看着那么长的代码头疼，甚至连代码排列起来都变得好看多了
3、mixin：mixin的用法，主要在于可以定义代码片段且可以传递参数，这样一句话似乎有点空泛，但从此css3的兼容性不再需要反复写webkit、moz、ms、o了，传递一个参数，直接生成兼容代码，这样应该就好理解了。
4、扩展/继承：本功能与定义变量有点类似但又不完全相同，但这个扩展/继承，其实也是调用，只是不用经过前期特殊处理，直接一个@extend+css名即可使用调用命令，而后scss会将拥有相同属性的所有css名生成一个逗号串联的css样式。
5、运算：没什么可多说，用你要的宽度/父级宽度*100%，不用多说，响应式神器。
6、颜色：为a标签定义了一个颜色，然后调用，hover时颜色浓度增加10%，即可生成新的颜色，如果是相同颜色明度的转换，那简直不要太方便了，若是hover时为不同颜色，此快捷方式倒是不大适用。
另外，各种css文件如果合并则修改不便，如果不合并，又会因为数次加载影响速度，而scss可以将所有的scss文件输出到一个css中，修改时还可以保持原本各自为政的局面，这不能不说也是个亮点。
当然，各种变量、嵌套、调用什么的，看起来似乎挺麻烦，但这份麻烦，其实挺能强化全局统筹能力。何谓全局统筹能力？在你写完一个pc端页面后又写响应式，发现要改动的地方超级多，那就说明全局统筹能力不行。我不是在说你，我说我自己。
曾经有过研究bootstrap的想法，只是想到bootstrap那冗杂的代码就嫌烦，也始终不认可bootstrap万金油式的完美，既然有scss这么好的东西，自己也能一步一步做到完美，为什么要用bootstrap来增添麻烦？当然，bootstrap好用又便于第三方维护是确实存在的优点，这一点无可否认。
最后，若想查看scss具体效果，请点击链接进入scss十分钟入门
