建立並使用 mixin

要建立 mixin,請使用 @mixin 指令。

@mixin default-box ($color, $borderColor) {
    color: $color;
    border: 1px solid $borderColor;
    clear: both;
    display: block;
    margin: 5px 0;
    padding: 5px 10px;
}

你可以在 mixin 的名稱後面的括號內指定引數列表。記得用 $ 開始你的變數並用逗號分隔它們。

要在另一個選擇器中使用 mixin,請使用 @include 指令。

footer, header{ @include default-box (#ddd, #ccc); }

mixin 中的樣式現在將用於 footerheader,其中 #ccc$color 變數,#ddd$borderColor 變數。