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

问题描述

我正在使用 extjs4，我想要做的事情似乎很简单，但我找不到可行的解决方案.

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.

我有一个 64*64px 的图标，我希望我的按钮将它显示为背景图片，但 extjs 只显示图像部分.在网上搜索了一个解决方案，但没有人为它提出工作解决方案.我只是想让我的背景图片适合我的按钮.

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.

这是我的js代码:

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

这是我的 css 代码:

here is my css code:

.x-btn-icon .startbutton {
    background-image: url(start.png) !important;
}

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

i tried some css combinations and still no success.

推荐答案

iconCls 严格指的是按钮的图标，如果你想让图片覆盖整个按钮，你应该将背景添加到添加到按钮.

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'
}

和CSS

.startbutton {
    background-image: url(start.png) !important;
}

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