scss的继承@extend 和站位符 %

继承：
@extend 指令告诉 Sass 一个选择器的样式从另一选择器继承。
如果一个样式与另外一个样式几乎相同，只有少量的区别，则使用 @extend 就显得很有用。
这样就可以达到复用的目的，减少代码的重复量。

比如：

.container-a {
	width: 200px;
	height: 100px;
	margin-left: 10px;
}

container-b 和 contaienr-a 有几乎同样的样式属性，则可以这样来写：

.container-b {
	@extend .containerb-a; // 在没有被调用的时候就会被解析
	background-color: #fffccc;
}

占位符：%占位符名

%button-basic {  
	// 编译后不会出现在css文件中
 	//公共代码；
	margin-top: 15px;
	width: 10px;
	height: 10px;
}
.cancel-btton {
  @extend %button-basic;  //  @extend继承
  background-color: #fffccc;
}
.submit-button {
  @extend %button-basic;
  background-color: #ED2FDC;
}