html - 如何使按钮图像填充它？

Question

我正在尝试将图像应用到 xtype='button' 但是当我这样做时，我的按钮看起来像这样

我怎样才能让这个图像填充这个按钮？

代码（sencha touch 2 js）：

        {
            xtype: 'button',
            width: 140,
            height: 60,
            margin: 10,
            right: 20,  

            text: 'Enter',
            html: '<img src="resources/images/Dbutton.png"/>'
        }

Answer 1

要在所有浏览器上工作，请将 html 更改为

    <input type='image' src='filename.png' width='25' height='25' name='whatever' value='submit' />

这使用图像作为提交按钮。

Answer 2

如果图像是按钮上的背景图像，则使用 CSS 属性background-size。

.mybutton {
    background-size: cover;
}

请注意，这在 IE8 或更早版本中不起作用。如果你想要 IE8 支持，你需要使用 polyfill javascript。试试这个：https ://github.com/louisremi/jquery.backgroundSize.js

希望有帮助。