SASSでのネストされたインポート

通常、@importはドキュメントの先頭で使用されますが、 SASSプリプロセッサはファイルを任意の場所、セレクタ内も含めてインポートすることを可能にします。

次の例を見てみましょう：

.active {
	color: blue;
}

次に、これをファイル style.scss にインポートします：

div {
	@import "main";
}

コンパイル結果を見てみましょう：

div .active {
	color: blue; 
}

次の内容でファイル navbar.scss を作成してください：

.link {
	color: red;
	font-size: 12px;
}

次に、このフラグメントをファイル styles.scss のブロック #main にインポートし、 styles.css にコンパイルしてください。