[Sass]混合宏的參數--混合宏的不足

混合宏在實際編碼中給我們帶來很多方便之處,特別是對於復用重複代碼塊。但其最大的不足之處是會生成冗餘的代碼塊。比如在不同的地方調用一個相同的混合宏時。如:

@mixin border-radius{
  -webkit-border-radius: 3px;
  border-radius: 3px;
}

.box {
  @include border-radius;
  margin-bottom: 5px;
}

.btn {
  @include border-radius;
}

示例在“.box”和“.btn”中都調用了定義好的“border-radius”混合宏。先來看編譯出來的CSS:

.box {
  -webkit-border-radius: 3px;
  border-radius: 3px;
  margin-bottom: 5px;
}

.btn {
  -webkit-border-radius: 3px;
  border-radius: 3px;
}

上例明顯可以看出,Sass在調用相同的混合宏時,並不能智能的將相同的樣式代碼塊合併在一起。這也是Sass的混合宏最不足之處。

results matching ""

    No results matching ""