插值從類名稱的值與SCSS

Question

我要設置這個類的名字：

<div class="col with-v-margin-10"></div> 

和SCSS得到，我已經通過類的名稱設置的值，並適用於CSS規則。

.with-v-margin-${#} { 
    margin-top: ${#}px; 
    margin-top: ${#}px; 
} 

有可能嗎？

Answer 1

我不這麼認爲。

一種替代方案是使用mixins。

@mixin sexy-margin($margin) { 
    margin-top: ${margin}px; 
    margin-top: ${margin}px; 
} 

.with-v-margin-10 { @include sexy-margin(10); } 
.with-v-margin-20 { @include sexy-margin(20); }