今天完成的事情：

学习了更多sass功能

群组选择器的嵌套

在CSS里边，选择器h1h2和h3会同时命中h1元素、h2元素和h3元素。与此类似，

.button button会命中button元素和类名为.button的元素。这种选择器称为群组选择器。

群组选择器 的规则会对命中群组中任何一个选择器的元素生效。

.button, button {

  margin: 0;

}

如果你需要在一个特定的容器元素内对这样一个群组选择器进行修饰，情况就不同了。

css的写法会让你在群组选择器中的每一个选择器前都重复一遍容器元素的选择器。

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

sass的嵌套特性在这种场景下也非常有用。当sass解开一个群组选择器规则内嵌的规则时，

它会把每一个内嵌选择器的规则都正确地解出来：

.container {

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

}

首先sass将.container和h1.container和h2.container和h3分别组合，然后将三 者重新组合成一

个群组选择器，生成你前边看到的普通css样式。对于内嵌在群组选择器内的嵌 套规则，处理方式也一样：

nav, aside {

  a {color: blue}

}

首先sass将nav和aaside和a分别组合，然后将二者重新组合成一个群组选择器：

nav a, aside a {color: blue}

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

尤其在当嵌套级别达到两层甚至三层以上时，与普通的css编写方式相比，只写一遍群组选择器大大减少了工作量。

有利必有弊，你需要特别注意群组选择器的规则嵌套生成的css。虽然sass让你的样式表看上去很小，

但实际生成的css却可能非常大，这会降低网站的速度