SCSS多個變量的值相同

Question

如果我有這樣的SCSS：

$a: #fff; 
$b: #fff; 
$c: #fff; 
$d: #fff; 

對此有什麼捷徑？

Answer 1

如果你因爲某些原因需要他們持有相同的值，但需要將它們保存爲語義或獨立變量可讀性，或使簡單的變化在路上，你可能只是這樣做：

$a: #fff; 
$b: $a; 
$c: $a; 
$d: $a; 

我在開發過程中可能會改變顏色打交道時，這樣做不時。這裏有一個例子：

$background_color: white; 
$text_color: #444; 
$link_color: $text_color; 
$overlay_color: rgba($background_color, 0.7); 

這是有用的，因爲它讓我改變的$text_color價值，並具有$link_color反映了同樣的變化，而在同一時間能夠設置$link_color到完全不同的東西。只使用一個變量$text_color和$link_color都意味着我不得不手動查看所有實例以查看哪些與文本相關，哪些與鏈接有關。我認爲一個好的做法是根據它們的用途命名變量，即$text_color和$link_color而不是​​。

Answer 2

不要使用4個變量，只使用1，如果它們具有相同的價值

$a: #fff; 
$a: #fff; 
$a: #fff; 
$a: #fff;