web-dev-qa-db-ja.com

Sassミックスインのオプションの引数をスキップする

単純なCSS3線形グラデーションを処理するためにこのミックスインがあります。

_@mixin linear-gradient($from, $to, $dir: bottom, $dir-webkit: top, $ie-filters: false) {
    background-color: $to;
    background-image: -webkit-linear-gradient($dir-webkit, $from, $to);
    background-image: linear-gradient(to $dir, $from, $to);
    @if $ie-filters == true and $old-ie {
         filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#{ie-hex-str($from)}', endColorstr='#{ie-hex-str($to)}');
    }
}
_

_$dir_は「方向」の略です。

_$ie-filters_ 'true'にする必要があり、_$dir_/_$dir-webkit_のデフォルト値を変更する必要がない場合でも、それらを再宣言する必要がありますが、明らかにそれほどではありませんDRYそして最適なので、これを行う必要があります：

@include linear-gradient(#7a7a7a, #1a1a1a, bottom, top, true);

私がこれをしたいとき：

@include linear-gradient(#7a7a7a, #1a1a1a, true);

ミックスインを呼び出すときに、この方法で引数をスキップするにはどうすればよいですか？

PS _$dir-webkit_引数について疑問がある場合は、新しいグラデーション構文をまだ処理しないため、Webkit用です（参照： http://generatedcontent.org/post/37949105556/updateyourcss =->新しいグラデーション構文）、方向は標準構文の反対である必要があります。

sassmixins
32
Chris Pearce

SASS 3.1以降、名前付き引数を渡してそれを行うことができます。

@include linear-gradient($from: #7a7a7a, $to: #1a1a1a, $ie-filters: true);

残りはデフォルトになります。

54
markus