3

彼らのサイトでは、彼らは使用方法の例を示しています@arguments：

.box-shadow (@x: 0, @y: 0, @blur: 1px, @color: #000) {
  box-shadow: @arguments;
  -moz-box-shadow: @arguments;
  -webkit-box-shadow: @arguments;
}
.box-shadow(2px, 5px);

その結果：

box-shadow: 2px 5px 1px #000;
  -moz-box-shadow: 2px 5px 1px #000;
  -webkit-box-shadow: 2px 5px 1px #000;

すべての引数を取り、それらをスペースで区切るだけのようです。私は実際に：で使用するために引数をコンマで区切って欲しいですlinear-gradient：

background: linear-gradient(top, @arg1, @arg2, @arg3...);

これは少ないコストで可能ですか？

4

2 に答える 2

3

@Allanの回答に触発されて、線形勾配関数に@argumentsを渡すには、次を使用する必要がありました。

.linear-gradient-multi( ... ) {
   background-image: -webkit-linear-gradient( ~`"@{arguments}".slice(1,-1)` );
   ...
}

そうして初めて、パーセンテージと変数を使用してミックスインを呼び出すことができます。

.linear-gradient-multi(left, #CCC 0%, #DDD @percent, #FFF @percent + 1, #FFF 100%);
于 2013-03-29T16:50:44.780 に答える
2

あなたはこのようなことをすることができます

.mixin(...) {
  filter: gradient( ~`@{arguments}.join(",")` );
}

test {
 .mixin("x1","x2","x3")
}

javascriptを実行できるようにするには、バックティックを使用する必要があります。ただし、これは、arguments配列内のすべての要素が有効なjavascript変数である必要があることを意味します。そのため、ミックスインを呼び出すときは、すべての引数を引用符で囲んでjavascript文字列にする必要があります。上記のコードは次のようにコンパイルされます。

test {
 filter: gradient(x1,2,3);
}
于 2013-01-16T09:17:45.607 に答える