問題
4
Sass
文字列の変数を展開してクラス名にしよう
Sassの問題に挑戦しよう！
問題
「文字列の変数を展開してクラス名にしよう」
変数を展開して「期待するCSS」を実現しましょう。
あらかじめエディタに書くコード
$prefix: ".ninja";
[ここで変数を展開する]-red {
color:red;
}
[ここで変数を展開する]-blue {
color:blue;
}
¥SASS¥
期待する画面
.ninja-red {
color: red;
}
.ninja-blue {
color: blue;
}
¥CSS¥
解答と解説（文字列の変数を展開してクラス名にしよう）
解説
LINE登録して解答を見る
※ご登録後トークルーム下部にあるメニュー内
「無料問題集※解答付き」を押すと
解答閲覧用URLが届きます
通常の変数展開であれば、$変数名 とすればokだが
キーワードの中などで参照する場合は #{$変数名} とする必要がある。
これをインターポレーションと呼ぶ。
