Фоновое изображение кнопки

Question

Я пытаюсь установить изображение кнопки, но не покрывает всю кнопку. Я имею в виду, фон кнопки все еще виден.

Я пытаюсь сделать это во время выполнения, предоставляя разные изображения для каждой кнопки в цикле.

Здесь:

for(var i=0; i<tvStore.getCount(); i++) 
    { 
    var aButton = Ext.create('Ext.Button', 
    { 
     margin:8, 
     id:'button'+i, 
     itemId:i, 
     style: 'width: 110px;height:110px;background-image:url(someRandomWebURLToImage) !important', 

Но изображение не покрывает все кнопки. или если изображение невозможно растянуть, то как я могу сделать фон кнопки прозрачным?

Спасибо,

Answer 1

Вы можете использовать iconCls атрибут для указания CSS, как это:

{ 
    xtype   : 'button', 
    iconCls   : 'cart', 
    text   : 'Add to Cart', 
    iconMask  : true, 
    padding   : 10, 
    margin   : 10, 
    id    : 'addToBagBtn' 
} 

и файл CSS должен иметь:

.x-tab .x-button-icon.cart, .x-button .x-button-icon.x-icon-mask.cart { 
    -webkit-mask-image: url('../../touch/resources/themes/images/default/pictos/shop1.png'); 
}