css - 如何以不同方式设置标准 GWT 组件 (TabBar) 的样式？

Question

我正在使用 TabBar，我想以不同的方式设置组件的样式。所以一次是这种风格，另一次是那种风格。我认为这会起作用，但它没有:

TabBar t = new TabBar();
t.addTab( "1" );
t.addTab( "2" );
t.addStyleName( MyResources.INSTANCE.css().slickTab() );

和:

public interface MyResources extends ClientBundle
{
 public static final MyResources INSTANCE = GWT.create(MyResources.class);
 @Source("style.css") MyCssResource css();
}
public interface MyCssResource extends CssResource
{
 String slickTab();
}

在 CSS 中

.slickTab .gwt-TabBar .gwt-TabBarItem {
  background-color: #ff0000;
  font-weight: normal;
}

但外观没有改变。我做错了什么？

Answer 1

您可以在 CSS 中强制执行此操作。

.slickTab .gwt-TabBar .gwt-TabBarItem {
    background-color: #ff0000 !important;
    font-weight: normal !important;
}

此外，由于您添加的样式受父样式的约束。如果是这种情况，您可能需要设置“setStylePrimaryName”而不是添加它，并使用处理程序在样式更改之间切换。