SCSS rem mixin需要多個屬性

我目前使用的是Karl Merkli的REM mixin。SCSS rem mixin需要多個屬性

它很好用，但是我發現我在這個過程中寫了很多@includes。例如：

@include rems(height, 1); 
    @include rems(width, 1); 
    @include rems(margin, 1, 0, 4, 0); 
    @include rems(padding, 0.5, 1); 
    // plus all other @includes Ii might use too 
    @include opacity(0.7); 
    @include clearfix; 
    // etc

我試圖找出一種方法，將同一個mixin的引用合併爲一個。最終，我正在尋找一個解決方案，我可以寫類似下面的東西：

@include rems(height, 1; width, 1; margin, 1, 0, 4, 0; padding, 0.5, 1;);

在此先感謝

來源

2016-07-26 Brian Edelman

如果你想添加更多屬性到mixin rem會怎麼樣？像這樣： '@mixin rem（$ property，$ values，$ property，$ values，$ property，$ values）' 我沒有使用這些mixins，所以答案可能真的很愚蠢，但哦好吧，因爲我GOOGLE了，我沒有找到任何解決方案，所以唯一的辦法是自己修改mixin。 –

一個解決方案是創建一個在中間的mixin是採用清單列表，並雙手各列表關閉的rems混入：

@mixin multi-rems($lists) { 
    @each $list in $lists { 
     @include rems($list...); 
    } 
}

，然後用它像這樣：

li { 
    @include multi-rems(((margin, 0, 4), (padding, 2, 3))); 
}

這是SassMeister Gist。乾杯。

來源

2016-07-26 13:46:35 bowheart

非常好。我絕對可以用這個。謝謝你的幫助。 –

沒問題。玩的開心！ – bowheart

SCSS rem mixin需要多個屬性

回答

相關問題