Verwenden von Variablen für CSS-Eigenschaften in Sass

Question

Ich schreibe ein @ Mixin mit einigen Mathe darin, die die prozentuale Breite eines Elements berechnet, aber da es sehr nützlich ist, möchte ich die gleiche Funktion für andere Eigenschaften, wie Ränder und Polsterungen.

Gibt es eine Möglichkeit, den Eigenschaftsnamen als Argument an ein Mixin zu übergeben?

@mixin w_fluid($property_name, $w_element,$w_parent:16) { 
    $property_name: percentage(($w_element/$w_parent)); 
} 

Answer 1

Sie müssen interpolation verwenden (zB. #{$var}) auf Variable, um für Sass es als CSS-Eigenschaft zu behandeln. Ohne es tun Sie nur variable Zuweisung.

@mixin w_fluid($property_name, $w_element, $w_parent:16) { 
    #{$property_name}: percentage(($w_element/$w_parent)); 
} 

Answer 2

Neben der @rcorbellini Antwort

Sie Zeichenfolge und variable zusammen

@mixin margin($direction) { // element spacing 

    margin-#{$direction}: 10px; 

}