【SCSS】2.7 @Mixins(混合) + @include(擴充 / 繼承)

本來只想寫試寫Mixins，不過偷剪BootStrap的範例時，發現他是連同include寫在一起，我不會拆開，索性一起貼上試跑看看，誒...然後...他就轉譯成功了......


官方說法（然後我看完並不懂他再說什麼）：
http://sass.bootcss.com/docs/sass-reference/#control_directives
Mixins允許您定義可以在整個樣式表中重複使用的樣式，而無需使用非語義類.float-left。Mixins還可以包含完整的CSS規則，以及Sass文檔中其他地方允許的任何其他規則。他們甚至可以採取一些參數 ，這些參數可以讓你用很少的mixin來製作各種各樣的風格。


看完程式碼後的理解：
Variables(變數) = 定義一個變數名，並決定這個變數名的值（可以是數字、單位、顏色...）
取用的時候直接寫 $變數名 
例如：

【SCSS】2.6 map 與 @each 迴圈

延續上述的例子，當你以為寫到這樣就很迷人，那就錯了。

.color-primary {color: $primary;}

.color-warning {color: $warning;}

.color-xxxxx01 {color:...

.color-xxxxx02 {color:...

.color-xxxxx03 {color:...

.color-xxxxx04 {color:...

.color-xxxxx05 {color:...

程式碼就跟迷你裙一樣越短越好，當色碼超過10個，整段看起來就會很恐怖。而且一直寫重複的名稱讓我覺得自己像個智障= =|||