Question

我是GWT / uiBinder的新手（GWT的最新版本，并在最新的Eclipse下测试）并且真的很困惑。我的按钮CSS是......

/* --button-- */
.gwt-Button {
    font-size: 16px;
    font-weight: normal;
    color: #0F0;
    background: #F00;    /* this gets ignored */
}

背景不起作用，其余的都有效。

我已经测试过这个CSS条目通过改变颜色并看到它有效来做某事。我也试过“背景颜色”（我在各种文档中都看过）。背景永远不会改变。

我还测试了一个gwt-TextBox如下，它工作得很好。

/* --text box-- */
.gwt-TextBox {
    font-size: 16px;
    font-weight: normal;
    color: #0F0;
    background: Beige;
}

注意：我知道有时候在测试时你必须刷新网页才能看到你的更改。

注意：我可以使用名为“myButton”的CSS条目设置按钮背景，并在uiBinder条目中使用styleName ='myButton'。

注意：该按钮位于北部的LayoutPanel中的图层中：东部的DockLayoutPanel：DockLayoutPanel。

帮助！

Answer 1

https://stackoverflow.com/a/7833358/635411

您可以使用更具体的选择器，如其他答案所示：

/* --button-- */
button.gwt-Button {
    font-size: 16px;
    font-weight: normal;
    color: #0F0;
    background: #F00;
}

就个人而言，我试图避免因优先级问题而覆盖默认样式。

Answer 2

我认为这应该可以解决你的问题

.gwt-Button {
         font-size: 16px;
         font-weight: normal;
         color: #0F0;
         background: #F00 !important; 
}

Answer 3

在对gwt-Button

的背景进行任何更改之前，您需要包含此行

background-image:initial !important;

您遇到的问题是，当gwt-Button使用背景图片时，您尝试设置背景颜色，因此图像会覆盖您的背景颜色，使您的css看起来像被忽略

Answer 4

有一种更简单的方法你需要删除gwt-Button样式，然后添加你喜欢的任何颜色 `

Button button=new Button();
button.removeStyleName("gwt-Button");
button.getElement().getStyle().setbackgroundColor("#F00");
//incase you need to remove the default border style aswell
button.getElement().getStyle().setBorderStyle(BorderStyle.NONE);

`

GWT按钮背景不起作用

4 个答案: