2012-01-25 11 views
3

ブラウザ固有のルールを使用する実行時スキニング変更を有効にするには、 2つのCSSリソース機能、つまり実行時置換とリテラルを組み合わせる必要があります。CSSリソース - リテラルとランタイム置換の組み合わせ

は、例えば、ダイナミックボタンの勾配を持つように、私はそのような何かをするだろう:

lightBgとdarkBgが@Evalを使用して、実行時に評価され
button { 
    background: literal("-moz-linear-gradient(top, lightBg 0%, darkBg 100%)"); 
    background: literal("-webkit-linear-gradient(top, lightBg 0%, darkBg 100%)"); 
    background: literal("-o-linear-gradient(top, lightBg 0%, darkBg 100%)"); 
    background: literal("-ms-linear-gradient(top, lightBg 0%, darkBg 100%)"); 
    background: linear-gradient(top, lightBg 0%, darkBg 100%); 
} 

GWTはリテラル文字列を解析しないため、これらの2つの値は評価されません。 here

可能でしょうか?おかげさまで

答えて

3

は、私はあなたがリテラルとその最後のリテラルが必要とされているかどうか

background: literal("-moz-linear-gradient(") top lightBg 0, darkBg 100 literal(")"); 

わからないようなものを見ることができ、通常のCSSを、連結することができます信じています。

+0

Works!はい、最後のリテラルが必要です。 ここに正しいバージョンがあります(FF用の小さな修正がいくつかあります): 'background:literal(" - moz-linear-gradient( ")top、lightBg 0%、darkBg 100%literal(") ");' –

+0

Weird 、私は最初にそのパーセント記号をタイプしたと誓っていたかもしれません...あなたはそれが働いてうれしい! –

+0

gwt 2.5-rc1では、この「magic literals」の回避策は不要になりました。あなたはあなたの質問と同じように簡単に代用することができ、それはうまくいくでしょう。 グラントの例でgwtチームが使用しているテストケースは次のとおりです。http://gwt-code-reviews.appspot.com/1735804/diff/8001/user/test/com/google/gwt/resources/client/test .css – Ajax