4

GWT の ClientBundle と CssResource を使用して、css 定義を取り込みます。

画面サイズに応じてビューポートを設定したいと思います。CssResource 内でこれを達成する方法を知っていますか?

私の失敗した試み...テストを簡単にするために、代わりに背景の色合いを使用しました。ただし、すべてのデバイスの背景は緑です。

body {background-color:green;}

@media only screen and (max-width:480px) {
body {background-color:red;}
}

GWT [v2.5] コンパイラが警告を出します: [WARN] 行 x 列 12: "screen" に遭遇しました。次のいずれかが必要でした: "{" ","

ただの警告ですが、この場合は無視してはいけません。

4

4 に答える 4

4

GWT [v2.5] はメディア クエリをサポートしていません。使用したい場合は、回避策を実行する必要があります。

  • クライアント バンドル インターフェイスで、ソース css を TextResource としてマークします。

    @Source("mycss.css") TextResource myCss();

  • entryPoint クラスに移動し、リソースを注入します。

    StyleInjector.inject(AppBundle.INSTANCE.carouselCss().getText());

これを行うと、CssResource から拡張されたインターフェース MyCss が失われ、特に UIBinder から css クラスを呼び出すことができます。ただし、少なくとも、メディア クエリを使用できます。

于 2013-04-05T15:13:58.657 に答える
3

少し変更がある場合は、次のように @eval も回避策として使用できます

@eval BG_COLOR com.google.gwt.user.client.Window.getClientWidth()<480?"red":"green";  

body {background-color:BG_COLOR;}
于 2013-11-06T09:38:44.070 に答える