javascript - ExtJS & Css 面板背景

标签 javascript css extjs

作为一个整体,我对 Sencha ExtJS 和 Css 都是新手。基本上我在一个主面板中有一个 3 个子面板。我想使用 CSS 将相同的背景颜色设置为主面板内的三个面板。我创建了一个 .css 文件并将其链接到 HTML 中。 CSS文件的内容是:

.x-panel.child-content-style {
background-image : url('TitleBackground.png');

通过设置 bodyStyle:{"background-image":"url('TitleBackground.png')"} 配置,我可以在不使用 css 的情况下实现这一点。它工作得很好,但我觉得使用 css 可能有更好的方法。

当我尝试使用 cls 配置属性添加我的 css 时,没有任何反应。当设置 bodyCls 属性时,它会设置整个应用程序的背景,这不是我想要的。我希望将背景更改为只有几个面板。我还尝试在 bodyStyle 配置中指定 css 元素名称来代替内联,但没有任何乐趣。

这是我的子面板:

{ xtype: 'panel', html: '<img src=\'appIcon.png\' style=\'width:52px;height:52px\'> &nbsp;', cls: 'child-content-style' },
                    { xtype: 'panel', html: '<h2 style=\'font-family:verdana\'>Toolkit v3.0</h2>', bodyStyle:{"background-image":"url('TitleBackground.png')"} },
                    { xtype: 'panel', html: '&nbsp;<img src=\'appIcon.png\' style=\'width:52px;height:52px\'>', bodyStyle:{"background-image":"url('TitleBackground.png')"} }

这甚至有可能做到,还是我应该开玩笑说输了而让它内联?

谢谢

最佳答案

我相信是bodyCls你在找什么。

关于javascript - ExtJS & Css 面板背景,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/26214739/

相关文章:

javascript - 使用事件委托(delegate)时如何访问与元素关联的数据

javascript - nodejs方立方求值器抛出超出最大调用堆栈大小

javascript - 我应该在 API 中公开可导出字段吗?

css - IE/Edge CSS3 Transitions 不适用于 background-position 属性

css - Bootstrap 导航菜单在 Safari 和 IE 的特定页面上损坏

extjs - 当前不支持混合模式 x 编译和微加载标记(EXTJS 4.1.1、sencha cmd 4.0)

javascript - Sencha touch 从 json 获取数据

javascript - 如何使用 D3.js 将图像添加到 svg 容器

JavaScript/HTML5 addEventListener() 不适用于 <select> 标签

testing - Selenium 问题