SASS
Googleでログイン問題3：スタイルを継承して色違いのボタンを作ろう
期待する画面になるよう穴埋めしよう！
あらかじめエディタに書くコード
.btn{
text-align: center;
color: #fff;
font-size: 20px;
font-weight: bold;
border-radius: 5px;
padding: 10px 20px;
}
.btn-red{
//ここに1行足して期待するcssにしよう
background-color: red;
}
¥SASS¥
期待する画面
.btn, .btn-red {
text-align: center;
color: #fff;
font-size: 20px;
font-weight: bold;
border-radius: 5px;
padding: 10px 20px;
}
.btn-red {
background-color: red;
}
¥CSS¥
解答ソースコード
.btn-red{
@extend .btn;
background-color: red;
}
¥SASS¥
完了にする！
活動記録をTweetする
1.SASSとは
@extend .btn; とし
.btnの部分が継承したいクラス名だ。
情報が少ない問題なので、
これをクリアできた方は
検索力が高いと言えるでしょう。