如何将Panel的背景颜色设置为透明

Question

我已将我的面板配置设置为：bodyStyle: 'background:transparent;'但它不起作用。我也尝试过：defaults: { bodyStyle: 'background:transparent;' }。

function cre1ColumnHboxForModErrMsg(itemA){
    var hb = new Ext.Panel(
        {   layout:'fit'
            ,height:75
            ,frame: false
            ,border: false
            ,bodyStyle: 'background:transparent;'
            ,layoutConfig:{ align:'top', pack:'center' }
            ,defaults:{ layout:'form', labelWidth:CampConst.CampModErrMsgLabelWidth ,width:175,border:false}
            ,items:[
                {   width:((CampConst.CampModErrMsgWidth/2)-30)
                    ,defaults:{ labelSeparator:'', msgTarget:'side', selectOnFocus:true,anchor:'95%' }
                    ,items:[
                        itemA
                    ]
                }
            ]
        }
    );
    return hb;
}

我哪里错了？

Answer 1

尝试style: 'background:transparent;' - 这适用于整个面板元素而不仅仅是身体。

然而，据说你看起来并不真的需要一个面板，可以用一个容器代替：

function cre1ColumnHboxForModErrMsg(itemA){

    var hb = new Ext.Panel(
        {   layout:'fit'
            ,height:75
            ,frame: false
            ,border: false
            ,bodyStyle: 'background:transparent;'
            ,layoutConfig:{ align:'top', pack:'center' }
            ,defaults:{ layout:'form', labelWidth:CampConst.CampModErrMsgLabelWidth ,width:175,border:false}
            ,items:[
                {   width:((CampConst.CampModErrMsgWidth/2)-30)
                    ,defaults:{ labelSeparator:'', msgTarget:'side', selectOnFocus:true,anchor:'95%' }
                    ,items:[
                        itemA
                    ]
                }
            ]
        }
    );
    return hb;
}