设置上的按钮透明的背景是不是在IE9

Question

工作，我有哪里我使用一些工具栏身后有背景，所以我做了工具栏和按钮，透明的ExtJS的应用程序。我的一些用户仍然坚持IE9（我知道），并且按钮显示不正确。

为一个例子见小提琴这里：fiddle

在铬或IE 10+，工具栏按钮是透明的。它看起来是这样的：

在，IE9然而，它看起来像这样：

小提琴代码：

的按钮IE9

Ext.onReady(function() { 
     var win = Ext.create('Ext.window.Window', { 
      layout: 'fit', 
      height: 300, 
      width: 300, 
      autoShow: true, 
      tbar: { 
       style:'background-color:orange;', 
       items: [{ 
        text: 'hi', 
        style: 'background:transparent;' 
       }] 
      }, 
      html:'some html' 
     }); 
    }); 

Answer 1

的Ext JS框架创建表DOM。我们可以通过给frame:false &在style配置给边境&填充风格阻止它。

frame:false, 
style:'background-color:transparent;border:1px solid #d8d8d8!important;border-radius: 3px;padding: 3px!important;' 

全码：

Ext.onReady(function() { 
     var win = Ext.create('Ext.window.Window', { 
      layout: 'fit', 
      height: 300, 
      width: 300, 
      autoShow: true, 
      tbar: { 
       style:'background-color:orange;', 
       items: [{ 
        text: 'hi', 
        frame:false, 
        style:'background-color:transparent;border:1px solid #d8d8d8!important;border-radius: 3px;padding: 3px!important;' 
       }] 
      }, 
      html:'some html' 
     }); 
    }); 

Here是工作示例