Question

我的extjs 4.2 MVC应用程序的网格和图像透明度有点问题：这是我的网格：

Ext.define('XProject.view.message.inbox.Grid', {
    extend: 'Ext.grid.Panel',
    alias: 'widget.inboxgrid',
    store: 'message.Inbox',
    requires: [
        'Ext.ux.grid.FiltersFeature'  ,
        'XMailweb.view.message.inbox.CtxMenu'
    ],

    viewConfig: {
        getRowClass: function (record, rowIndex, rowParams, store) {
            if ((record.get('Flags') & 2 )== 0) {
                return "boldFont";
            }
            if (record.get('Err_Id') != 0) {
                return "redFont";
            }            
        }
    },

    selType: 'checkboxmodel',
    selModel: {
        checkOnly: false,
        injectCheckbox: 0
    },    

    features : [{
        ftype: 'filters',
        autoReload: false, 
        encode:true,
        paramPrefix : 'Filter'
    }],

    columns: [{
        xtype: 'gridcolumn',
        cls: 'attach',
        width: 18,
        dataIndex: 'Files_Num',
        menuDisabled: true,
        sortable:false,
        text: 'Attachment',
        renderer: function(value, metaData, record ){
            if (value >= 1){
                metaData.css  = 'attach';
            }
            return '';
        }       
    }]
})

省略了其他列。我的css角色是：

.attach {
    background:transparent url('../icons/attach.png') no-repeat center left !important;
    text-indent: -250px;
}

我的attach.png是透明的，但是在渲染网格时（使用备用行背景颜色）会显示白色背景。这是我的透明图片：

我的渲染网格：

enter image description here

为什么没有透明背景（网格中的所有css图像）？我尝试使用firefox和iexplorer，但结果却是一样的。有什么想法吗？

Answer 1

背景：透明覆盖背景颜色。

使用：

.attach,.attach .x-column-header-over{
    background-image:url('../icons/attach.png') !important;
    background-position:center left;
    background-repeat:no-repeat ;
}

之间：

background:transparent url('../icons/attach.png') no-repeat center left !important;

http://jsfiddle.net/Xpe9V/521/

网格中图像的透明度

1 个答案: