GWT:如何应用 CSS3 渐变

Question

我的任务是构建 Web 应用程序的前端，我想做的是在 Button 上应用 CSS3 渐变。我正在使用带有 GWT 插件的 Eclipse，并且正在使用 GWT 插件在 Google Chrome 中查看 UI。

我的问题是 GWT 似乎删除了括号之间的空格，以便:

.gwt-Button {
    background: -moz-linear-gradient(top, white, #72C6E4 4%, #0C5FA5);
    background:-webkit-gradient(linear, left top, left bottom, from(white), to(#0C5FA5), color-stop(0.03, #72C6E4));

变成:

.gwt-Button {
    background: -moz-linear-gradient(top,white,#72C6E44%,#0C5FA5);
    background:-webkit-gradient(linear,lefttop,lefbottom, from(white), to(#0C5FA5), color-stop(0.03, #72C6E4));

这使它们无效。有没有另一种方法可以解决这个问题，或者有一种方法可以防止在编译应用程序时删除空格？谢谢。

Answer 1

您必须使用 literal() 函数。我相信它可能只适用于通过 aCssResource 作为其 GWT 函数使用的样式。

background: -webkit-gradient(linear, literal("left top"),
            literal("left bottom"), from(white), to(#0C5FA5) );

我刚才窃听了这个here但还没有得到 GWT 团队的任何回应，所以如果您认为这是一个有效的错误，请给它加注星标。

此外，作为旁注，这些样式不适用于旧版本的 ie，您需要添加 filter 属性。这是一个 example .