擴充/繼承(Extend)

擴充(Extend)是可以擴充原有的CSS類別定義，你可以再加上不同的定義或覆蓋原有的定義，例如下面的範例:

使用時機

如果要增加一個class 裡面的屬性 別的class已經有了 不想重複寫屬性就直接繼承

如下

.header {
    color: red;
    a {
        width: 100px;
        @include border-radius(10px);
    }
    b {
        @extend a
    }
}

css結果 b 會跟a 有同樣的屬性

.header a,
.header b {
  width: 100px;
  -webkit-border-radius: 10px;
  -moz-border-radius: 10px;
  -ms-border-radius: 10px;
  border-radius: 10px;
}

擴充(Extend)的用法相當簡單，相較於混合(Mixin)它不能傳入值，而且會合併相同的定義在同一個類別之中。