Sassの「&」を利用して親クラスを便利に参照する（2）

前回はSassファイルで「&」を利用して、親クラスと&以下に記述したクラスを繋ぐ方法をご紹介しました。

今回は、囲っているクラスの上位に新しいクラスを指定して記述する方法をご紹介します。

.scss ファイル

.sample1 {
  .sampleWrap & {
    font-weight:bold;
  }
}

↓　これを展開すると下記のように囲われていたクラスの上位クラスとして、記述されます。 &は囲んでいるクラスを表す記号ということですね。

.css ファイル

.sampleWrap .sample1 {
  font-weight: bold;
}