ログイン
問題3

引数が無くても数値が出力されるmixinを作ろう

アイコン画像

問題3:引数が無くても数値が出力されるmixinを作ろう

mySizeと言う名前のmixinを作り「期待するCSS」を実現しましょう。

エディターのアイコンあらかじめエディタに書くコード

                .ninja1{
  @include mySize();
}
.ninja2{
  @include mySize(500px);
}
¥SASS¥
              

ブラウザのアイコン期待する画面

                  .ninja1 {
  width: 200px;
}
.ninja2 {
  width: 500px;
}
¥CSS¥
                

タグアイコン解答ソースコード

              @mixin mySize($size: 200px){
  width: $size;
}
¥SASS¥
            

コメントのアイコン解説

sassのmixinは引数に $size: 200px とすることで
初期値を設定しておくことができる。

このパターンはプログラミング言語でも使える事が多いので
知っておくと良いだろう。
ログインして解答を見る
完了にする!
twitterのアイコン
活動記録をTweetする
1.SASSとは
続きの動画を見たい方は公式LINEから「sass」と送信すると動画が見れます。

LINE登録で、Web制作に役立つコンテンツ配信中‼

LINEの友達追加でお役立ち動画をGET!!
LINEの友達追加でお役立ち動画をGET!!