將樣式應用到GWT小部件

我剛開始探究GWT，並且我對用GWT小部件應用樣式的不同方式感到困惑。在gwt文檔中，有4種方法可以用來覆蓋小部件的默認樣式，將樣式應用到GWT小部件

1）使用在宿主HTML頁的標籤。（已取消） 2）使用模塊XML文件中的元素。（已棄用） 3）使用包含在ClientBundle內的CssResource。 4）在UiBinder模板中使用內聯元素。

假設我有一些包一個CSS文件說，com.abc.xyz.styles.css。而文件中有如下內容，

/**the panel itself**/ 
.gwt-TabLayoutPanel { 
    border: none; 
    margin: 0px; 
    padding: 0px; 
} 
/**the tab bar element**/ 
.gwt-TabLayoutPanel .gwt-TabLayoutPanelTabs { 
    background-color: #F4F4F4 !important; 
} 
/**an individual tab**/ 
.gwt-TabLayoutPanel .gwt-TabLayoutPanelTab { 
    background-color: #6F6F6E !important; 
} 

.gwt-TabLayoutPanel .gwt-TabLayoutPanelTab-selected { 
    background-color: white !important; 
} 
/**an element nested in each tab (useful for styling)**/ 
.gwt-TabLayoutPanel .gwt-TabLayoutPanelTabInner { 
    font-family: Arial !important; 
} 

/**applied to all child content widgets**/ 
.gwt-TabLayoutPanel .gwt-TabLayoutPanelContent { 
    border: none; 
    margin: 0px; 
    overflow: hidden; 
    padding: 15px; 
}

我怎麼會注入這個css文件？如何使用上述造型的第三和第四選項來完成？

來源

2014-06-10 Karthik207

您可以簡單地將CSS文件添加到主機頁面。然後你可以使用CSS選擇器的全部功能。這是我的首選GWT中使用CSS的方法：

What the best strategy to structure CSS in GWT?

來源

2014-06-10 15:13:11

這將是有益的，如果你能舉一個例子，使用客戶端包+ CSS資源問題中提到我的情況.. – Karthik207

我不使用這些選項 - 與獨立的CSS文件相比，我發現它們開發速度過慢，難以維護。 –

將樣式應用到GWT小部件

回答

相關問題