SASSにおけるミックスイン
このレッスンでは、一つのクラスを他のクラスの中に取り込むことを可能にするミックスイン(mixin)を紹介します。これがどのようなもので、どのように使うのかを理解しましょう。
本質的に、ミックスインとは、他のクラスの中でクラスを使うことです。一つのクラスが定型コード、つまり多くの場所で使える特定のコード片として機能します。
これが便利な点は何でしょうか?純粋なCSSでは、この定型コードが必要な場所すべてで記述する必要がありますが、SASSでは一箇所に記述し、その後、コード内の必要な場所で読み込むことができます。
ミックスインを宣言するには、@mixinディレクティブを使います。その後、その名前、パラメータ、そして本体のブロックを指定します:
@mixin mix {
width: 100px;
height: 100px;
}