設置上的按鈕透明的背景是不是在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是工作示例