2017-04-27 7 views
0

次のセレクタB__E.B__E--Mを取得したいので、B__E--Mは、要素にもB__Eクラスがある場合にのみ適用されます。 --M修飾子は別の色を適用する必要がありますが、__E要素から既定の色を上書きしないことを、scssでクラスビルド(ダブルアンパサンド)

.B { 
    &__E { 
     // default color 
     &--M { 
      // Color i want 
     } 
    } 
} 

問題がある:

私は、次があります。

これが許可されていません。

.B { 
    &__E { 
     // default color 
    } 
} 

.B__E.B__E--M { 
    // color i want 
} 

何もできない場合は、これは私の推測のようになります。

.B { 
    &__E { 
     // default color 
     &.B__E--M { 
      // Color i want 
     } 
    } 
} 

答えて

2

あなたは二重のアンパサンドセレクタを探しています。

.B { 
    &__E { 
     color:black; 
     &#{&}--M{ 
      color:white; 
     } 
    } 
} 

/* // Outputs: 
    .B__E { 
    color: black; 
    } 
    .B__E.B__E--M { 
    color: white; 
    } 
*/ 
+0

正確に!それを知らなかった;) – Mazz