0

我知道有很多关于这个主题的帖子，但即使在查看并尝试使用所有“cls”配置之后，我的按钮的背景颜色也不会改变。

这是我的代码：

var miscTools = Ext.create('Ext.panel.Panel', {
    title: 'Tools',
    id: 'toolsPanel',
    bodyPadding: 5,
    height: 200,
    border: false,
    collapsible: false,
    layout: 'anchor',
    defaults: {
        anchor: '100%'
    },
    items: [{
        xtype: 'button',
        id: 'colorToolButton',
        text: 'Auto color tool',
        cls: 'multiColor-btn',
        handler: colorWindow
    }]
})

CSS：

.multiColor-btn {
    background-color: yellow;
}

我究竟做错了什么 ？

答案

所以问题出在 ExtJS 的灰色主题上。我需要删除按钮的背景图像以添加背景颜色。感谢@Alexander 的回答。

正确代码：

.multiColor-btn {
    background-image: none !important;
    background-color: yellow !important;
}

另一种选择是使用“afterRender”事件来更改背景颜色。但是，它只是改变了文本背景颜色。感谢@nenadg 的回答。

Ext.getCmp('colorToolButton').btnInnerEl.addCls('multiColor-btn')

4

2 回答 2

0

尝试使用 userCls 属性而不是 cls 来获取其他样式。

http://staging.sencha.com/extjs/6.0/6.0.1-modern/#!/api/Ext.Component-cfg-userCls

于 2016-02-19T15:40:48.663 回答
0

尝试这个 ：

.multiColor-btn {
    background-color: yellow !important;
}
于 2016-02-19T15:19:14.990 回答