如何正确设置图标大小的按钮在extjs？ [英] How to correctly set icon size of a button in extjs?

问题描述

我使用extjs4，我想要做的似乎很简单，但我找不到一个工作的解决方案。

我有一个64 * 64px图标，我想让我的按钮显示为背景图像，但extjs只显示图像部分 。在网上找到一个解决方案，但没有人建议<

这里是我的js代码：

  {
 xtype：'button'，
 text：null， 
 iconCls：'startbutton'，
 //icon:'./assets/icons/startbtn.png', 
 // style：{height：'60px'}，
 width：64，
 height：64 
} 
  

这里是我的CSS代码：

  .x-btn-icon .startbutton {
 background-image：url （start.png）！important; 
} 
  

我尝试了一些css组合，但仍然没有成功。

解决方案

iconCls严格指向按钮的图标，如果你想要图片覆盖整个按钮，你应该添加背景到css类添加

  {
 xtype：'button'，
 width：64，
 height：64，
 text：'some text'，
 cls：'startbutton'
} 
  pre> 
 
 
和css 
  .startbutton {
 background-image：url（start.png）！重要; 
} 
  
 
I'm using extjs4 and What i'm trying to do seems to be simple but i can't find a working solution for it.

I have a 64*64px icon and i want my button to show it as the background image but extjs only shows the image partially.Googled on the net for a solution but nobody suggested a working solution for it.I just want my background image fit to my button.

here is my js code:
{
    xtype : 'button',
    text : null,
    iconCls : 'startbutton',
    //icon:'./assets/icons/startbtn.png',
    //style:{height:'60px'},
    width : 64,
    height : 64
}
here is my css code:
.x-btn-icon .startbutton {
    background-image: url(start.png) !important;
}
i tried some css combinations and still no success.
解决方案
The iconCls refers strictly to the icon of the button, if you want the picture to cover the whole button you should add the background to a css class added to the button.
{
    xtype: 'button',
    width: 64,
    height: 64,
    text: 'some text',
    cls: 'startbutton'
}
and the css
.startbutton {
    background-image: url(start.png) !important;
}


                        
这篇关于如何正确设置图标大小的按钮在extjs？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！