3

私はこのようなスタイラスの機能を持っています

// Shortcut for top-down gradient background color
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)
    @css
    {
        filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=color1, endColorstr=color2);
    }

Internet Explorerのグラデーションスタイルを文字通りのcssスコープ内にラップする必要があります@css。そうしないと、スタイラスがクラッシュします。おそらくコロンか何かが多すぎます。いずれにせよ、変数color1color2は文字通りcssスコープ内で取得されるため、スタイルが崩れます。

変数を解析するためにcssスコープを取得する方法はありますか?または、文字通りのcssスコープを使用せずにスタイラス内でフィルタースタイルを取得する方法はありますか?

4

1 に答える 1

6

これが1つの方法です:

filter s('progid:DXImageTransform.Microsoft.Gradient(GradientType=0, StartColorstr=%s, EndColorstr=%s)', color1, color2))

しかし、TJによるペン先もチェックすることをお勧めします。特に、彼はpngでグラデーション画像を自動生成し、それをスタイルシートにbase64エンコードするミックスインを作成しました。唯一の注意点は、高さ(または水平方向のグラデーションの場合は幅)を指定する必要があることですが、td:sには問題ありません。

更新:少しきれい:

filter 'progid:DXImageTransform.Microsoft.Gradient(GradientType=0, StartColorstr=%s, EndColorstr=%s)' % (color1 color2)
于 2012-02-21T12:28:50.810 に答える