sass中的@mixin混入 和 @extend继承
@mixin
需要使用@include mixin-name; 就可以直接使用
@extend 继承
可以直接继承通用的css 不用再单独去添加class类型
使用示例
.button-default { background-color: #f00; color: #fff; padding: 10px; border: none; border-radius: 5px; &:hover { background-color: #00f;}
} .button-large { @extend .button-default; font-size: 20px;
}
总结:@extend指令是Sass中非常有用的功能,它可以帮助我们避免重复编写代码,提高代码的可维护性和可重用性。通过将一个选择器的样式继承到另一个选择器上,我们可以更加高效地进行样式开发。