从extjs按钮删除轮廓

Question

我知道为了从链接中删除虚线轮廓，我需要执行以下操作：

a, a:active, a:focus {
    outline: 0 !important;
}

但是，使用extjs按钮时，这不起作用。

我尝试过将border设置为none，并使用outline：none！important。但是，这些都不起作用。另外，我试过把它概括为无.x-btn，.x-btn-focus，.x-focus等没有结果。

任何人都可以帮助我吗？我正在使用Ext JS 5.1.1.451 Classic进行测试。

编辑：我非常抱歉。我不知道如何分享Sencha Fiddle。这是测试代码。这使用Extjs 5.1

Ext.application({
name: 'Fiddle',

launch: function() {
    Ext.create('Ext.toolbar.Toolbar', {
        renderTo: document.body,
        width: 500,
        items: [{
            // xtype: 'button', // default for Toolbars
            text: 'Button'
        }, {
            xtype: 'splitbutton',
            text: 'Split Button'
        },
        // begin using the right-justified button container
        '->', // same as { xtype: 'tbfill' }
        {
            xtype: 'textfield',
            name: 'field1',
            emptyText: 'enter search term'
        },
        // add a vertical separator bar between toolbar items
        '-', // same as {xtype: 'tbseparator'} to create Ext.toolbar.Separator
        'text 1', // same as {xtype: 'tbtext', text: 'text1'} to create Ext.toolbar.TextItem
        {
            xtype: 'tbspacer'
        }, // same as ' ' to create Ext.toolbar.Spacer
        'text 2', {
            xtype: 'tbspacer',
            width: 50
        }, // add a 50px space
        'text 3']
    });
}
});

您可以尝试点击按钮，查看链接大纲。

这就是我所说的：

另外，如果有帮助，我在Debian上使用Chrome。

Answer 1

覆盖以下CSS：

.x-btn-focus.x-btn-default-toolbar-small .x-btn-wrap {
    outline: 1px dotted #333333;
}