sass中的继承使用@extend标识符，一次可以继承一个或多个样式。
继承
可以一次继承一个或多个样式。例如：
.alert{
height:30px;
width:100px;
}
.title{
color:yellow;
}
.success{
@extend .alert;
background-color:green;
}
.warn{
@extend .alert, .title;
background-color:red;
}
编译结果如下:
.alert, .success, .warn {
height: 30px;
width: 100px;
}
.title, .warn {
color: yellow;
}
.success {
background-color: green;
}
继承的作用域
继承在指令中是有作用域问题的，继承是无法使在指令如@media之外的选择器继承的，要是想要继承就只能在写指令中。
占位符 --- %
占位符可以使样式直接添加到继承的样式中，例如：
%alert{
height:30px;
width:100px;
}
%title{
color:yellow;
}
.success{
@extend %alert;
background-color:green;
}
.warn{
@extend %alert, %title;
background-color:red;
}
编译结果如下:
.success, .warn {
height: 30px;
width: 100px;
}
.warn {
color: yellow;
}
.success {
background-color: green;
}
.warn {
background-color: red;
}