Extjs 4中按钮文本颜色

Question

我使用的是 Exjts 4，我想要改变按钮的文本颜色。这是我的代码:

我正在使用Exjts 4，我想要更改按钮文本的颜色。这是我的代码:

{
     xtype: 'button',
     text: 'My Button',
     style:{
         color: 'red'
     }  
}  

- Alejandro Mosquera

Answer 1

如果有人需要的话，我不知道这是否是一个不太好的解决方案，但它可以工作。

{
 xtype: 'button',
 text: '<div style="color: red">My Button</div>',     
}  

- Alejandro Mosquera

Answer 2

Davor Zubak提供了一种解决方案，但在我的复杂应用程序中失败了。我通过以下方式实现了自己想要的：

1. Button's cls: 'myButton'

2. In my css file, define:

   .myButton .x-btn-inner {
       color: red;
       font-family: Georgia;
       font-size: large;
       font-weight: bold;
   }
   

这样做只会覆盖具有“myButton”cls的特定按钮的ExtJS主题。

- Marshal

Answer 3

在Extjs 4.2.0中存在一些奇怪的行为，但有可能会发生覆盖。使用cls:'yourClassName'属性为您的button添加一个class，然后在CSS中创建一个完整的路径到包含文本的span，例如：.yourClassName div a span。另外，请将您的css属性设定为!important值以成功覆盖基类。

Ext.create('Ext.Button', {

    text: 'Click me',

    renderTo: Ext.getBody(),

    handler: function() {
        alert('You clicked the button!');
    },

    cls: 'foo'
});

在CSS中只需使用以下代码：

.foo div a span
{
    color:#ff0000 !important;
}

Here is a example.

- Davor Zubak