如何正确使用GWT中导入的CSS样式

想象一下,您使用UiBinder创建了以下简单小部件：

stem "http://dl.google.com/gwt/DTD/xhtml.ent">
otted;
        }
    

package my.package;
// some imports here

public class Widget1 extends Composite {
    private static Widget1UiBinder uiBinder = GWT.create(Widget1UiBinder.class);

    interface Widget1UiBinder extends UiBinder

在您创建的另一个(父)窗口小部件中使用此简单窗口小部件：

stem "http://dl.google.com/gwt/DTD/xhtml.ent">
ottom: 10px;
        }
    

package my.package;
// imports go here
public class ParentWidget extends Composite {
    private static ParentWidgetUiBinder uiBinder = GWT.create(ParentWidgetUiBinder.class);

    interface ParentWidgetUiBinder extends UiBinder

你想要实现的是使用css在列表中的Widget1条目之间获得一些余量.但这不起作用.因为GWT会混淆css名称. ParentWidget中.childWidgetStyle的混淆名称将与Widget1中的.childWidgetStyle不同.生成的css看起来与此类似：

.G1unc9fbE {
    border-style:dotted;
    border-width:1px;
}
.G1unc9fbBB .G1unc9fDa {
    margin-bottom:10px;
}

因此保证金设定不适用.我该怎么做呢？

最佳答案

诀窍是将css类名导入ParentWidget：

stem "http://dl.google.com/gwt/DTD/xhtml.ent">
ottom: 10px;
        }
    

重要的是,如果你不使用ImportedWithPrefix注释,GWT会在导入的样式名前加上css类所在资源的类名.所以childWidgetStyle变成.Widget1Style-childWidgetStyle.

(编辑：在评论和documentation之后删除了关于@Shared的部分.)

版权声明：本文内容由互联网用户自发贡献，该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容， 请发送邮件至 [e-mail] 举报，一经查实，本站将立刻删除。