前言
CSS 原生代码的书写，在以往的开发中由于项目的增大会变得越来越难以维护。结构愈发庞大，类名、id各种选择器越来越多，在开发中书写样式时需要不断地重复父类名，且类名越来越长，名字越来越少，这对于项目的维护非常不利。有时候想要修改某个位置的样式，在几千行 CSS 样式代码中去定位该样式的位置是十分麻烦的。同时，CSS 在之前并不支持变量、函数之类的运算操作，不利于代码的复用，一样的样式除了复制粘贴之外别无选择。鉴于以上种种原因，社区涌现了几个优秀的 CSS 强化工具，目前主流便是 Scss 与 Less。本文集主要记录讲解 Scss 的使用，Less 在另一个文集。不过，Scss 完成之前并不会更新 Less 的文章。实际上这两种 CSS 强化工具乃至其他强化工具都大同小异，常用功能也相差不大，两者都很容易掌握。但本文集的目的在于记录 Scss 的使用方法，作为使用手册的同时，会研究一点实用且强大的小技巧，希望对 Scss 的使用更进一步。
Sass 与 Scss
两者其实是一个东西，区别在于书写样式。Sass 舍弃了大括号和分号，大括号使用空格代替，分号使用换行代替，本质在于减少无用代码的书写。Scss 则是对二者进行了保留。两者各有优势，使用上因人而异。官方演示案例使用 Scss 样式，本人习惯也是 Scss，Scss 在样式上贴近原生 CSS，阅读观感上也是更为舒服些。不过还是那句话，在语法和功能上二者并无区别，使用什么书写形式在于你自己。本文集主要讲解 Scss 的使用。
Scss 基础书写语法
本文集不会对 Scss 做全盘的记录和介绍，会记录一些实用的、常用的方法，也会研究一点 Scss 强大的小技巧，但这些强化其实内容很多，实用的也就那么几个点，没必要用那么复杂，与其研究 Scss，不如研究原生 CSS3。在一些方法上，原生的 CSS 有着更强大的能力和可读性。工具本身的使用就是如此，什么好用就用什么，能简单就简单，效率与实用永远是第一位的。
嵌套
在一众 CSS 强化工具中，代码嵌套是一个最基础的增强，这让 CSS 代码变得层次清晰，结构明了，更易读易维护。但无论这些形式如何花里胡哨，这些代码最终都会编译为原生的 CSS。但这无关紧要了，重要的是开发者方便了，效率更高，项目更加易于管理：
#main p {
color: #00ff00;
width: 97%;
.redbox {
background-color: #ff0000;
color: #000000;
}
}
编译后：
#main p {
color: #00ff00;
width: 97%;
}
#main p .redbox {
background-color: #ff0000;
color: #000000;
}
父选择器简写：&
有时，我们在嵌套了很多层后，想要使用到父选择器，比如要使用到伪元素或者伪类，就需要使用到父选择器。但这时已经嵌套了很多层，再回去找父选择器是哪个，再使用它，这并不比原生 CSS 好多少，于是，& 符号便成了父选择器的代词或语法糖，例如需要给父元素加个 hover：
a {
font-weight: bold;
text-decoration: none;
&:hover { text-decoration: underline; }
body.firefox & { font-weight: normal; }
}
属性嵌套
让我们再重复一遍 Scss 等强化工具的使命是什么？写得更少！既然如此，想象一下，我们在写字体样式时，是不是需要写一连串的font-xxxx？那么，Scss 同样做了简化：
.funky {
font: {
family: fantasy;
size: 30em;
weight: bold;
}
}
变量
CSS3 也支持变量，使用 -- 开头，但 Scss
里的变量使用 $ 开头，这与许多库的选择一样，$ 就是如此方便和舒适。Scss 的变量同样支持块作用域，在 { } 里声明的变量属于局部变量，之外的属于全局作用域，如果想要让一个块级作用域的变量成为全局作用域变量，可以在其后使用!global进行声明。
// $ 定义变量
$width: 5em;
#main {
width: $width;
}
// 局部变全局
#main {
$width: 5em !global;
width: $width;
}
#sidebar {
width: $width;
}
好吧，既然是初体验，讲到这里也差不多了。对于一些简单的样式，以上 Scss 技巧已经够用了，且以上书写形式也是最常用的。不过，既然是有进阶，这点东西自然是不够的。后面我们会研究更强大的 Scss 功能，包括mixin，函数等。其实，原生的 CSS3 的许多功能吃透也是不容易的，没有太多人深究 Scss 这种东西，如果写得太复杂，维护你代码的兄弟估计得对你进行亲切地问候了。
记住，简单实用，高效易维护是使用这些工具的基本原则。
