sass mixin使って見たらすごく楽しかった。。

mixin使ってみるとすごく楽しくなったのでメモします。
今までHTML・CSSのコーディングをするときは、スマホのレイアウトを作ってから、PCのレイアウトを作るという順番でやってきました。
PC用のレイアウトを作る際に、、、
@media screen and (min-width: 768px) { hoge: pcStyle }
これを連発していました。。。

そんなとき、mixinについてググっていると、@contentという便利なものがあるということを知りました！
これは使うしかない！！！

早速、、、

$tablet-width: 768px;
@mixin tablet-layout {
  @media screen and (min-width: $tablet-width) {
    @content;
  }
} 

このようにかくと、あの長いメディアクエリの記述が

@include tablet-layout {
  //スタイル
}

このようにかけてしまったのです。。うれしい。。たのしい。。めでたし。。

初心者がうれしくなって勢いで書いてしまったので間違っていたらすみません。ご指摘お願いします。。