Question

在我的子模块中，我想在运行时注入css：

public interface Resources extends ClientBundle
{
    Resources INSTANCE = GWT.create( Resources.class );

    @Source( "pagedown.css" )
    @NotStrict
    CssResource css();
}

来自java我使用Resources.INSTANCE.css().ensureInjected();并且它工作得很好，除了图像没有显示，在pagedown.css中：

.wmd-button>span {
    background-image: url(pagedown/wmd-buttons.png); 
    background-repeat: no-repeat; 
    background-position: 0px 0px; 
}

原因是因为无法找到图像。上面的代码在我的子项目（子模块）中进行重用，我必须将图像复制到我的应用程序项目以使其工作，这非常麻烦且打破封装，是否有解决这个问题的方法？

修改

如果我将上述css修改为background-image: url(myapp/pagedown/wmd-buttons.png);然而，它会工作，因为这个css是在子项目中，永远不知道我的应用程序项目的名称，所以如果我像这样硬编码，有一天我有另一个项目使用这个组件，我必须修改它myOtherApp/pagedown/wmd-buttons.png，您可以看到两个项目冲突，无法同时使用我的组件。感谢。

Answer 1

此样式属性的语法为：background-image: url("pagedown/wmd-buttons.png"); 所以代码变成了

wmd-button>span {
    background-image: url("pagedown/wmd-buttons.png"); 
    background-repeat: no-repeat; 
    background-position: 0px 0px; 
}

不是这个：

.wmd-button>span {
    background-image: url(pagedown/wmd-buttons.png); 
    background-repeat: no-repeat; 
    background-position: 0px 0px; 
}

Answer 2

我提出了一个解决方法：让组件在构造函数中接受一个参数，参数是项目基础url，用于获取相关图像url，在构造函数中，我使用GWTQuery附加正确的图像 - 背景URL

GWT：后台映像属性未在注入的外部css文件中显示

2 个答案: