css - 如何覆盖现代 GWT 应用程序中的默认 CSS？

Question

来自以下页面:Developer's Guide - CSS Style

很明显，在现代 GWT 应用程序中，有两种方法可以声明 css 样式:

使用 ClientBundle 中包含的 CssResource。在 UiBinder 模板中使用内联元素。

如何使用这两种方法中的任何一种来覆盖 GWT 默认样式，例如 gwt-Button、gwt-TextBox 等？

我知道仍然可以使用您从 html 页面或 .gwt.xml 文件中引用的 css 样式表。但是，我想避免这种情况，因为这些方法现在已被弃用。

Answer 1

使用@external @-rule 禁用给定 CSS 类名的混淆:http://code.google.com/webtoolkit/doc/latest/DevGuideClientBundle.html#External_and_legacy_scopes例如，您可以将以下内容放入任何 CssResource样式表:

@external .gwt-*;

但是 IMO，最佳实践是改为 addStyleName或 setStyleName (或在 UiBinder 中分别为 addStyleNames="…" 或 styleName="…")在小部件上。如果您想自定义主题，请先将其复制为您自己的主题并调整您自己的副本(而不是使用 CSS 级联 覆盖样式)。作为一个额外的好处，您将拥有更轻便的样式表，因此您的用户可以更快地下载它们，“越快越好”。

作为旁注，UiBinder 生成隐式 ClientBundle ，其中每个 <ui:style>元素生成隐式 CssResource (并自动调用 ensureInjected() )；所以 <ui:style> 之间没有太大区别和一个 CssResource .