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

harada 32views 更新:2015年5月18日

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

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

.scss ファイル

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

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

.css ファイル

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

ログイン / 新規登録してコメントする

このソースコードをストックして後で利用したり、作業に利用したソースコードをまとめることができます。

こちらもお役に立つかもしれません