在团队开发中，复用代码能减少冗余，抹平编写风格的差异。或者在编写同主题的组件，统一文字，颜色，间隔等样式，复用样式代码是必不可少的。

Sass提供四种样式复用的方法：

1. @import
2. @extend
3. @media
4. @mixin

@import

Sass @import跟原生css的@import类似，都是导入其他文件。如果Sass import的以下类型，Sass编译器就直接转换成原生，而不导入Sass文件。

@import "foo.css";
@import "foo" screen;
@import "<http://foo.com/bar>";
@import url(foo);

如果省略后缀，Sass会自动寻找对应的Sass文件并导入到文件中。

一般Sass都是配合下方的复用方法去使用，要复用其他文件的一些样式，记得先@import进来。

@extend

当需要复用通用样式的时候，就会用到这个@extends的语句。例如有一个通用button样式，和一个特殊button样式，那么Sass就会把关于.button的样式也会应用在.submit-button中。

// 通用样式
.button {
	color: #ffffff;
	background-color: blue;
}

.button.hasError {
	background-color: red;
}

// 特殊样式
.submit-button {
	@extend .button;
	color