sass基础---选择器继承 @extend

//通过选择器继承继承样式
.error {
  border: 1px solid red;
  background-color: #fdd;
}
.seriousError {
  @extend .error;
  border-width: 3px;
}

以上的结果是在代码中样式写法为 class="seriousError",
但在html中展示的最终效果是 class="seriousError error"

1. css样式中使用 @extend 后，不仅会继承父类的样式 ，所有和父类组合在一起的样式也会被继承到子类中。

//.seriousError从.error继承样式
.error a{  //应用到.seriousError a
  color: red;
  font-weight: 100;
}
h1.error { //应用到hl.seriousError
  font-size: 1.2rem;
}

2. 继承的高级用法

任何css规则都可以继承其他规则，几乎任何css规则也都可以被继承