仅覆盖某些元素的CSS选择器 - Sencha

Question

这是一个愚蠢的问题 - 但我已经坚持了一段时间而无法找到答案。

我试图仅为某些元素覆盖Ext.js复选框的颜色。

CSS：

.x-field-checkbox .x-field-mask :: after，.x-field-radio .x-field-mask :: after .emptyCell {     白颜色; }

注意那里的课 - .emptyCell

现在的Sencha代码：

    if(noCheckBox) {
        var checkbox = 
            {    
                    xtype: 'checkboxfield',
                    cls: 'opBuyoffCheckBoxCell emptyColumn',
                    readOnly: true
            };
        return checkbox;
    } else {
        var checkbox = 
            {    
                    xtype: 'checkboxfield',
                    cls: 'opBuyoffCheckBoxCell',
                    listeners: {
                          change: function (checkbox) {
                             //Todo put in logic on checkbox change 
                          }
                   }
            };
        return checkbox;
    }
},

这是什么问题？我有三个复选框。根据我的CSS和逻辑，其中两个应该呈现白色而另一个应该是正常的。我已经调试了，它正在进入正确的代码。但是当我启动我的应用程序时，它总是使用emptyColumn css类。

非常感谢帮助。

Answer 1

应用此css：

.emptyColumn .x-input-el:checked+.x-field-mask::after {
    color: #fff;
}

有一点需要注意，在CSS和HTML中编写相同的cl。