# 3.混合Mixin

SASS 的 **@mMixin** 的定義方式，MIXIN定義裡面還可以增加嵌套。

![](https://2396662457-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LlX7mJ4cxCl8pMfjLFQ%2F-LlX7o7G0jAxtu25nekE%2F-LlX7qCBWKU5e5wBu_wS%2Fsass15.jpg?generation=1565014592722198\&alt=media)

SASS使用mixin 要打 **@include** 來引用![](https://2396662457-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LlX7mJ4cxCl8pMfjLFQ%2F-LlX7o7G0jAxtu25nekE%2F-LlX7qCD1ETc1z0pNYZ8%2Fsass16.jpg?generation=1565014592872755\&alt=media)

**Mixin裡面的參數**

```css
@mixin alert($text-color, $background) {
    color: $text-color;
    background-color: $background;
    a{
        color: darken($text-color, 10%);
    }
}

.alert-warning {
    @include alert(#e69813,#f00909);
}
.alert-info {
    @include alert($background:#fff, $text-color:#13e61e);
}
```

![](https://2396662457-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LlX7mJ4cxCl8pMfjLFQ%2F-LlX7o7G0jAxtu25nekE%2F-LlX7qCFEO6NesuE_mmu%2Fsass17.jpg?generation=1565014592860683\&alt=media)
