建立並使用 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 中的樣式現在將用於 footer
和 header
,其中 #ccc
為 $color
變數,#ddd
為 $borderColor
變數。