在CSS属性中访问GWT ImageResource？
在CSS属性中访问GWT ImageResource？
提问于 2012-06-26 22:43:33
下面是Google/GWT创建ImageResource的例子：
interface MyResources extends ClientBundle {
@Source("image.png")
ImageResource image();
@Source("my.css");
CssResource css();
}
@sprite .myImage {
gwt-image: 'image';
}我知道如何使用ImageResources和应用样式名称，但是...
在我的应用程序中，我使用CSS和延迟绑定将多个主题应用于各种小部件。所以我定义了一个CSS规则('background')，我想使用.myImage类，但它什么也不做：
background {
background-attachment: fixed;
background-image: .myImage; //?? This is the question!
background-size: contain
}在'background‘CSS属性中使用.myImage类的语法是什么？似乎我应该能够指定.myImage类作为背景图像的参数。
编辑:我做了更多的研究，找到了使用DataResource执行此操作的正确语法。
MyClientBundle extends ClientBundle {
//Background Image
@Source("resources/background.png")
DataResource backgroundImage();
}(mypanel.css)
@url background backgroundImage;
.myPanel {
border-radius: 0px;
background-color:#ffffff;
opacity:0.6;
background-image: background;
}回答 4
Stack Overflow用户
发布于 2014-02-20 03:30:11
如果您将"myImage“作为样式名称添加到任何小部件，它将设置这些小部件的背景...
Stack Overflow用户
发布于 2018-04-03 01:38:55
在'background‘css属性中使用.myImage类的语法
MyClientBundle extends ClientBundle {
//Background Image
@Source("resources/background.png")
DataResource backgroundImage();
}(mypanel.css)
@url background backgroundImage;
.myPanel {
border-radius: 0px;
background-color:#ffffff;
opacity:0.6;
background-image: background;
}Stack Overflow用户
发布于 2019-05-02 22:53:44
我认为正确的方法是定义@ImageOptions，其余的在css-class本身中定义。
对于我来说，下面的代码
Theme.java
public interface Theme extends ClientBundle {
@ImageOptions(repeatStyle = RepeatStyle.None, preventInlining = true)
@Source("path/logo.png")
ImageResource logo();
@Source("theme.css")
ThemeCss css();
interface ThemeCss extends CssResource {
String logo();
}
}theme.css
@sprite .logo {
gwt-image: "logo";
background-size: contain;
background-attachment: fixed;
}生成以下输出：
.GLOMG3GI {
height: 344px;
width: 633px;
overflow: hidden;
background:url(data:image/png;base64,iV...=) -0px -0px no-repeat;
background-size: contain;
background-attachment: fixed;
}您可以在gwt-image属性之后覆盖任何css属性，也可以使用ImageOptions覆盖。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/11209876
复制相关文章
相似问题