群组嵌套及属性嵌套

群组选择器嵌套

群组选择器的嵌套可以节省您的嵌套语法带来的重复代码，是您的样式编写更加高效。

实例演示 :

#test-box h1{font-size:50px;}
#test-box h2{font-size:40px;}
#test-box h3{font-size:30px;}

可以简化为 :

#test-box {
    h1{font-size:50px;}
    h2{font-size:40px;}
    h3{font-size:30px;}
    // 公共样式
    h1, h2, h3{line-height:2em; margin-top:10px;}
}

通过群主嵌套既可以实现每个样式单独的定义，还可以将公共部分统一进行定义，是一个非常方便、有用的技巧。

属性嵌套

在 sass 中，除了CSS选择器，属性也可以进行嵌套。如 : 您只需敲写一遍 border

nav {
  border: {
  style: solid;
  width: 1px;
  color: #ccc;
  }
}

嵌套属性的规则 ：把属性名从中划线-的地方断开，在根属性后边添加一个冒号: 紧跟一个{ }块，把子属性部分写在这个{ }块中。