※ 引述《leizzzz (叽哩咕噜稀哩哗啦)》之铭言：
: 想请教一下有使用sass版Bootstrap的前辈们~
: sass版本里面有多一个mixins的资料夹
: 我知道它可以让我们这样写:
: div {
: @include make-row();
: }
: 但是这跟使用@extend的差别在哪里呢？
: div {
: @extend .row;
: }
: 生出来的CSS是不一样，但是效果似乎没差？
: 想请问一下，什么情况要用mixin，什么情况适合extend呢？
: 我目前都只有使用extend (因为字比较少XD)
我只用过 LESS，SASS 是否一样我不清楚。
LESS 的 mixin 和 extend 写法分别是
div {
.make-row();
}
div {
&:extend(.row);
}
mixin 是引入 .make-row 的样式到 div 中。
extend 是扩充 div 成 .make-row 的样子。
所以两者对于 scope 的行为才会刚好相反。
* global class 不能引入在 media query 内的 class
* global class 可以扩充成 media query 内的 class
* media query 可以引入 global class
* media query 不能扩充成 global class
同样地，在 mixin 内也不要使用 extend。
另外这两者也常被当作 composite 和 extend。
假设我要建立一个 component，我可能会先建立一个 base-class
接着建立一些 sub-class，extend base-class，
最后在 sub-class 内加入不同的 mixin 调整样式。
这个 component 的行为、element 可以定义在 base-class 中，
而其它的 sub-class 就负责样式的部份。
（虽然 Bootstrap 是 base-class + modifier 的型式）
base-class 定为名词，mixin 定为动词，也算是 naming convention。
mixin 还有另一个功能是当作函数使用。
根据传入的变量决定要引入哪些值。
extend 也有另一个功能，用来减少档案大小。
有些非常基本的 base-class，像 clearfix，也常被其它的 component extend
两者分开用的时候是没什么差别，混用的时候就要注意一下是打算做什么了。
然后 IE 还是 Chrome 好像有 Selector 的上限，这可能要查一下。