如何使用自訂 CSS 覆蓋 GWT 主題樣式？

使用自訂CSS 覆蓋GWT 主題樣式

將具有自訂CSS 樣式的HTML 檔案整合到GWT 應用程式中時，您可能會遇到衝突，其中預設GWT 主題樣式會覆蓋您的樣式。以下是解決此問題並優先考慮自訂 CSS 的方法。

替代解決方案

根據GWT 郵件列表討論中的建議，您可以建立一個ClientBundle 來引用您的CSS 檔案：

<code class="java">import com.google.gwt.core.client.GWT;
import com.google.gwt.resources.client.ClientBundle;
import com.google.gwt.resources.client.CssResource;

public interface Resources extends ClientBundle {

      public static final Resources INSTANCE = GWT.create(Resources.class); 

      @Source("style.css")
      @CssResource.NotStrict
      CssResource css();
}</code>

在EntryPoint 類別的onModuleLoad() 方法中，注入CSS 檔案以確保其優先於GWT 主題樣式：

<code class="java">public class YourApp implements EntryPoint {

    public void onModuleLoad() {
        //...
        Resources.INSTANCE.css().ensureInjected(); 
        //...
    }
}</code>

此方法提供了使用自訂CSS 覆蓋GWT 主題樣式的乾淨便捷的方法，確保維持應用程式的預期視覺呈現。

以上是如何使用自訂 CSS 覆蓋 GWT 主題樣式？的詳細內容。更多資訊請關注PHP中文網其他相關文章！