Less-parametric-mixins

提供:Dev Guides
2020年6月22日 (月) 22:47時点におけるMaintenance script (トーク | 投稿記録)による版 (Imported from text file)
(差分) ← 古い版 | 最新版 (差分) | 新しい版 → (差分)
移動先:案内検索

LESS-パラメトリックミックスイン

説明

パラメトリックミックスインは、引数とそのプロパティを使用してLESSの機能を拡張する1つ以上のパラメーターを使用し、別のブロックにミックスされたときのミックスイン出力をカスタマイズします。

たとえば、シンプルなLESSコードスニペットを考えてみましょう-

.border(@width; @style; @color) {
   border: @width @style @color;
}

.myheader {
   .border(2px; dashed; green);
}

ここでは、幅、スタイル、色の3つのパラメーターを持つ_.border_としてパラメトリックミックスインを使用しています。 これらのパラメーターを使用して、渡されたパラメーター値でミックスイン出力をカスタマイズできます。

次の表に、さまざまなタイプのパラメトリックミックスインと説明を示します。

Sr.No. Types & Description
1

Mixins with Multiple Parameters

パラメーターは、コンマまたはセミコロンを使用して区切ることができます。

2

Named Parameters

ミックスインは、名前を使用して位置ではなくパラメーター値を提供します。

3

@arguments Variable

ミックスインが呼び出されると、_ @ arguments_には渡されたすべての引数が含まれます。

4

Advanced Arguments and the @rest Variable

Mixinは、 …​. を使用して可変個の引数を取ります。

5

Pattern-matching

mixinにパラメーターを渡すことにより、mixinの動作を変更します。