入れ子の&の使い方

こんにちは、みとりです。

SASSの勉強を始めたのですが、&の使い方についてまとめますね。

結論から言うとSASSの&は単純に親要素と同じコードを取得するという意味でした。

<main class="main"> <h1 class="main_title">みとりスクール</h1> </main>

classのmainとmain_titleって全くの別のクラス名ですが

.main{ 
font-size: 25px;

&_title{ 
 color:blue;
} 

}

のようにまとめられます。

<main class="main"> <h1 class="main title">みとりスクール</h1> </main>

だったら

.main{ 
font-size: 25px; 

&.title{
 color:blue;

} 

}

となるのを学習しました。

この記事を書いた人

ともひろ