在创建样式的时候，有些样式的选择器很可能会有一部分是重复出现的，比如这个针对导航栏设计的样式里面，会重复的出现 .nav ... 下面的 .nav 空格 ul ，表示的就是我们想针对 .nav 这个类下面的 ul 标签去添加样式 ... 这个 .nav 空格 ul 空格 li ，表示的就是，针对在 .nav 这个类所在的标签下面的 ul 标签里面的 li 标签去添加样式 ...

这种样式选择器的写法，不会影响到其它地方的 ul 标签还有 li 标签的样式。关于 CSS 的选择器的写法，你可以参考宁皓网的 《 CSS3 选择器 》这个课程。

Sass 提示了一种更简洁的方法来写这样的选择器。就是使用嵌套的方式 ... 下面我们使用 Sass 的方法去改造一下 ... 在这个 .nav 里面去嵌套需要的样式 ... 另起一行 ... 把下面的 .nav ul 复制到这里 ... 可以去掉前面的 nav ...

再去把 .nav ul li 放到这里 .. 去掉前面的 .nav 空格 ul ... 把这块样式，嵌入到这个 ul 的样式里面 ... 这样我们就可以删除掉下面这两块样式了 ...

保存 ... 你会看到编译以后，输出的 CSS 跟之前是一样的 ...

因为这个 ul 样式，嵌入到了 .nav 这块样式里面，编译的时候，Sass 会先把被嵌套的样式的父选择器拿出来，再加上这个嵌套的样式的选择器。也就是你在右边看到的， 被嵌套的 ul 的样式的选择器是它的父选择器 .nav ，然后空格，再加上它本身 ... 也就是 ul ..

这个 ul 样式里面又嵌套了一个 li 这块样式 ... 编译好以后，这块样式就会是这块样式的所有的父选择器，也就是 .nav 空格 ul ... 再加上 li 本身 ...