SCSS 继承

选择器继承来精简 CSS

使用 sass 的时候，选择器继承是一个减少重复的主要特性。通过@extend语法实现的选择器继承是是一个选择器可以继承为另一个选择器定义的所有样式。如下代码 :

.error {
  border: 1px solid red;
  background-color: #fdd;
}
.seriousError {
  @extend .error;
  border-width: 3px;
}

何时使用继承

之前的章节我们学习了混合器，主要用于展示性样式的重用，而类名用于语义化样式的重用。因为继承是基于类的（有时是基于其他类型的选择器），所以继承应该是建立在语义化的关系上。当一个元素拥有的类（ 比如说 .seriousError ）表明它属于另一个类（ 比如说.error），这时使用继承再合适不过了。

继承的高级用法

任何 css 规则都可以继承其他规则，几乎任何css规则也都可以被继承。大多数情况你可能只想对类使用继承，但是有些场合你可能想做得更多。最常用的一种高级用法是继承一个html元素的样式。默认的浏览器样式不会被继承，因为它们不属于样式表中的样式，但是你对html元素添加的所有样式都会被继承。

接下来的这段代码定义了一个名为disabled的类，样式修饰使它看上去像一个灰掉的超链接。通过继承a这一超链接元素来实现：

.disabled {
  color: gray;
  @extend a;
}