ミックスイン

構文：定義

								@mixin ミックスイン名() {

								    内容

								}
							

構文：呼び出し

								@include ミックスイン名;
							

サンプルコード

定義

@mixin(引数名) { ... }のような感じでミックスインの定義で丸括弧に引数名を定義して受け取ります。
引数名は$引数名と先頭に$（ダラー）を付けた名前で指定します。

引数は複数用意することができ、@mixin(引数名, 引数名) { ... }とカンマ区切りで指定します。

引数は呼び出し元の値を省略し初期値を割り当てることができ、@mixin(引数名: 初期値) { ... }とコロンで繋げて指定します。

									@mixin ミックスイン名($引数名) {

									    内容

									}
									引数の初期値指定あり：
									@mixin ミックスイン名($引数名:初期値) {

									    内容

									}
									引数の複数指定：
									@mixin ミックスイン名($引数名n, $引数名n:初期値) {

									    内容

									}
								

呼び出し

@include ミックスイン名(渡す値)のようにミックスイン名に丸括弧をに渡す値を指定します。

複数の引数は、@include ミックスイン名(渡す値, 渡す値)とカンマ区切りで指定します。

特定の引数を名前で指定することができ、@mixin(引数名: 渡す値) { ... }と指定します。

									@include ミックスイン名(渡す値);
									引数の複数指定：
									@include ミックスイン名(渡す値, 引数名);
									引数名指定：
									@include ミックスイン名(引数名:渡す値);
								

サンプルコード

定義

定義側の内部で@contentを使用します。
呼び出し側で指定されたスタイルが記述した@contentで展開されます。

									@mixin ミックスイン名 {

									    ...

									    @content;

									    ...

									}
								

呼び出し

呼び出し側で@include ミックスイン名 { スタイル }と中括弧で囲って渡すスタイルを指定します。

									@include ミックスイン名 {

									    スタイル

									}
								

サンプルコード