css – GWT UiBinder样式的主要名称不起作用

我正在尝试使用UiBinder覆盖特定小部件的样式.我在俯瞰什么？

<ui:style>
  /*************
   * Note #1
   *************/
  .btnVote {
     display: inline-block;
     width: 50px;
     height: 50px;
     background: #fff;
     margin: 5px;
     text-align: center;
     outline: none;
     cursor: pointer;
  }

  /*************
   * Note #2
   *************/
  .btnVote-up-hovering, .btnVote-down-hovering {
     background: #ddd;
  }

  .btnVote-up-disabled, .btnVote-down-disabled {
     border-shadow: inset 0 1px 3px #aaa;
  }

  .lblName {
     line-height: 50px;
     font-size: 40px;
     padding: 5px 10px;
  }

  .clear {
     clear: both;
     overflow: auto;
  }

  .floatLeft {
     float: left;
  }
</ui:style>

<g:HTMLPanel styleName="{style.clear}">

    <g:FlowPanel styleName="{style.floatLeft}">

       /*************
        * Note #3
        *************/
        <g:PushButton ui:field="btnVoteUp" stylePrimaryName="{style.btnVote}">
            (+)
        </g:PushButton>

        <g:PushButton ui:field="btnVoteDown" stylePrimaryName="{style.btnVote}">
            (-)
        </g:PushButton>
    </g:FlowPanel>

    <g:FlowPanel styleName="{style.floatLeft}">

        <g:Label ui:field="lblName" stylePrimaryName="{style.lblName}"/>
    </g:FlowPanel>
</g:HTMLPanel>

注1：此规则正在应用并且正常工作

注2：其他规则似乎被忽略(它们没有生效)

注3：正在重置窗口小部件的默认命名,因此注1工作正常.基类设置为GOGXR1SCFI而不是gwt-PushButton

为什么他们的其他规则不起作用？当我悬停窗口小部件时,类GOGXR1SCFI-up-hovering确实设置为窗口小部件,但没有附带的CSS.

谢谢你的帮助.

更新

我碰到的东西给了我一段时间的困难：当你使用@external关键字时,你必须在@external语句的末尾放置一个半列,如：

<ui:style>
@external .btnVote;
.btnVote {
   ...
}
</ui:style>

<g:FlowPanel styleName="{style.btnVote}"/>

您可以做的一件事是使用ClientBundle创建CSS,在那里定义所有不同的状态,然后手动处理各种状态.这样您就不需要将类定义为@external,并且GWT将为您优化CSS(缩短名称,仅发布使用的内容等).这对于自定义小部件等尤其有用.