Css Sencha触控：绿色前进按钮

好的，这里有一个不同类型按钮的sencha链接。 所以，从这里开始，按钮向前移动，我做到了

{
xtype: 'button',
ui: 'forward',//I'm adding this string to make it with a right arrow
text: 'forward'
}

很好，很完美。那很容易

---

是否有人知道如何将此按钮变为绿色（不仅是按钮，而且箭头也变为绿色？

实际上，对于箭头，他们使用了webkit mask，因此，无论您使用css背景色为该箭头指定什么背景色，都会采用该颜色。因此，要使该按钮变为绿色，请使用以下代码：-

.x-button-forward, .x-button-forward:after { background: -webkit-linear-gradient(top, #a2e306,#7eb105 3%,#5b7f03); }

---

解决方案是用以下内容覆盖css类：

.x-webkit .x-button-forward:before, .x-webkit .x-button-forward:after, 
.x-webkit .x-toolbar .x-button-forward:before, .x-webkit .x-toolbar .x-button-forward:after 
{
 width: 15px;
 height: 32px;
 background-repeat: no-repeat;
 background-image: url(data:image/png;base64,XXXXXXXXXXXXXXXXXXXXXXXXX);
}

其中，

xxxxxxxxxxxxxxxxxxxx

字符串是由在线服务（谷歌用于生成数据：image/png；base64或类似内容）从my

myarrow.png

image生成的。

简单：

{
  xtype: 'button',
  ui: ['confirm', 'forward'],
  text: 'forward'
}