SASSを使用してCSSのdivの変数を変更する方法はありますか？

Question

div内の変数の割り当てを変更する方法があるのだろうかと思います。コードを表示する は、私は私が欲しいものより見えていると思う：。

IIRC

## CSS ## 
.div-name-1 { 
    $cor: #f00; 
} 

.div-name-2 { 
    $cor: #d1d1d1; 
} 

.div-name-3 { 
    $cor: #fff; 
} 

.whatever{ 
    background: $cor; 
} 

<div class="div-name-2> 
<div class="whatever"> 
</div> 

<div class="div-name-3> 
<div class="whatever"> 
</div> 

Answer 1

、SASSの変数は.div-name-1ので、彼らが表示されるブロックにスコープされており、 .whateverは異なるブロックであり、異なるスコープであり、それらの間で変数の値を転送することはできません。

あなたは、彼らが同じブロックにあるように、あなたのSASSのコードを再編成、または同じ効果を作成するために、ミックスインを導入する必要があります。また

.div-name-1 { 
    $cor: #f00; 

    .whatever { 
    background: $cor; 
    } 
} 

.div-name-2 { 
    $cor: #d1d1d1; 

    .whatever { 
    background: $cor; 
    } 
} 

：

@mixin whatever($cor) { 
    .whatever { 
    background: $cor; 
    } 
} 

.div-name-1 { @include whatever(#f00); } 
.div-name-2 { @include whatever(#d1d1d1); }