CssResource示例？

Question

我正在迁移到CssResource的使用。但是，我不明白如何使用前缀样式:(...类似于：

.prefix .label {
 padding: 10px;
}

.prefix .button {
 padding: 20px;
}

我必须如何将其转换为CssResource类并在代码中使用它:(...我在玩@Import和@ImportedWithPrex，@Share，但这一切都有点令人困惑，文档也很难理解:(...请帮帮忙？

边缘

Answer 1

下面是一些演示ImportedWithPrefix注释用法的代码

 interface Bundle extends ClientBundle {
    @Source("CssImportScopeSample.css")
    InnerStyle innerStyle();

    @Source("CssImportScopeSample.css")
    OuterStyle style();
  }

  @ImportedWithPrefix("inner")
  interface InnerStyle extends Style {
  }

  @ImportedWithPrefix("outer")
  interface OuterStyle extends Style {
  }

  interface Style extends CssResource {
    String body();
  }

和一小段UiBinder代码..

<ui:UiBinder xmlns:ui='urn:ui:com.google.gwt.uibinder' >
  <ui:with field='bundle' type='com.google.gwt.uibinder.test.client.CssImportScopeSample.Bundle' />

  <ui:style import='com.google.gwt.uibinder.test.client.CssImportScopeSample.OuterStyle
        com.google.gwt.uibinder.test.client.CssImportScopeSample.InnerStyle'>
    .outer-body .inner-body { width: 100px; background-color: red; }   
  </ui:style>

  <div class='{bundle.style.body}'> 
    <span ui:field='outer'/>
    <div ui:field='inner' class='{bundle.innerStyle.body}'>Inner!</div>
  </div>
</ui:UiBinder>

希望这能让你走上正轨……