SASS

$nav-color:#F90; 声明变量

nav {

$width:100px;  

width:$width;  

color:$nav-color;

}

使用一个特殊的sass选择器，即父选择器。在使用嵌套规则时，父选择器能对于嵌套规则如何解开提供更好的控制。它就是一个简单的&符号

article a {

color:blue;  

&:hover { color:red }

}

减少代码 

处理这种群组选择器规则嵌套上的强大能力，正是sass在减少重复敲写方面的贡献之一

.container h1, .container h2, .container h3 {margin-bottom:.8em}

=》 .container {

  h1, h2, h3 {margin-bottom: .8em}}

在sass中，除了CSS选择器，属性也可以进行嵌套。尽管编写属性涉及的重复不像编写选择器那么糟糕，但是要反复写border-styleborder-widthborder-color以及border-*等也是非常烦人的。在sass中，你只需敲写一遍border:

nav{

border: {

  style: solid;width:1px;color:#ccc;

}}

混合器使用@mixin标识符定义，可以在你的样式表中通过@include来使用这个混合器，混合器还可以传递参数

继承 因为继承是基于类的(有时是基于其他类型的选择器)，所以继承应该是建立在语义化的关系上。当一个元素拥有的类(比如说.seriousError)表明它属于另一个类(比如说.error)，这时使用继承再合适不过了