1

そのため、色を 6 文字の長い形式にする必要がある IE 固有のフィルターを使用しています。しかし、3 文字の短い形式を使用して、関数の呼び出しで満たされた 1,000 行のスタイルシートがあります。したがって、関数内から短い形式から長い形式に変換できることを願っています。任意の組み込み関数またはカスタム関数で十分です。私の関数は次のようになります。

td_gradient(color1, color2)
    background-color (color1 + (color2 - color1) / 2)
    background -webkit-gradient(linear, 0% 0%, 0% 100%, from(color1), to(color2))
    background -webkit-linear-gradient(top, color1, color2)
    background -moz-linear-gradient(top, color1, color2)
    background -ms-linear-gradient(top, color1, color2)
    background -o-linear-gradient(top, color1, color2)
    filter s("progid:DXImageTransform.Microsoft.Gradient(GradientType=0, StartColorstr='%s', EndColorstr='%s')", color1, color2)

入力色は と のよう#333に見えます#123が、Microsoft フィルター関数には#333333とが必要#112233です。スタイルシートのすべてのインスタンスまたは色を編集せずにそれを満たす方法はありますか?

4

1 に答える 1

4

スタイラスのソース コードを見ると、lib/nodes/rgba.js に RGBA.prototype.toString というメソッドがあります。268 行目で、次のことがわかります。

if (r[0] == r[1] && g[0] == g[1] && b[0] == b[1]) {
  return '#' + r[0] + g[0] + b[0];
} else {
  return '#' + r + g + b;
}

関数を作成してみましたが、文字列操作を行うために、色を文字列として戻すことができないようです。したがって、おそらく最も簡単な方法は、RGBA.prototypeこの短縮にパッチを適用して削除することです。

更新:わかりました、ここにあなたのための機能があります:

module.exports = function() {
    var hex = function(n) { return n.toString(16) };

    return function(style) {
        style.define('longColor', function(color) {
            return '#' + [color.r, color.g, color.b].map(hex).join("");
        });
    }
};

ファイルに入れておけば、 やスタイラスのjavascript APIでcolor.js使えます。スタイラスの使用法:stylus -u ./color.jsuse

td
  color longColor(#333)
于 2012-02-21T14:05:45.133 に答える